/* Trader cabinet — отдельная тема по макету */

/* Страница трейдера скроллится на уровне документа (.tr-shell/.tr-main только
   задают min-height:100dvh без своего overflow). При переключении вкладок
   Активные/Архив меняется число строк → высота контента → появляется/исчезает
   вертикальный скроллбар страницы и весь контент «дёргается» по горизонтали.
   Резервируем место под скроллбар страницы, чтобы ширина не менялась. */
html:has(.tr-app) {
  scrollbar-gutter: stable;
}

.tr-app {
  /* Тёмная тема «Графит» — нейтральный холодный графит + синий акцент (концепт 3). */
  --tr-bg: #0f1218;
  --tr-surface: #171b23;
  --tr-surface-2: #1f242e;
  --tr-line: #2a303c;
  --tr-purple: #5b9dff;
  --tr-purple-soft: rgba(91, 157, 255, 0.15);
  --tr-text: #e6e9f0;
  --tr-muted: #939bab;
  --tr-sidebar-w: 240px;
  /* шрифты темы — scoped на .tr-app, admin/merchant не затрагиваются */
  --font-sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-brand: "Onest", "Inter", "Segoe UI", sans-serif;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  background: var(--tr-bg);
  color: var(--tr-text);
}

.tr-app .payin-amount,
.tr-app .tr-dash-metric-value,
.tr-app .tr-balance-chip strong,
.tr-app .tr-dash-mini-value {
  font-variant-numeric: tabular-nums;
}

.tr-app .tr-shell {
  min-height: 100dvh;
  width: 100%;
  max-width: 100%;
  padding-left: var(--tr-sidebar-w);
  background: var(--tr-bg);
  overflow-x: hidden;
  /* overflow-x:hidden принудительно делает overflow-y вычисляемым auto → элемент
     становится вертикальным скролл-контейнером. Резервируем место под скроллбар,
     чтобы при смене высоты контента (вкладки Активные/Архив) ничего не «дёргалось». */
  scrollbar-gutter: stable;
}

.tr-app .tr-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--tr-sidebar-w);
  z-index: 40;
  display: grid;
  grid-template-rows: auto 1fr auto;
  background: #0e0e14;
  border-right: 1px solid var(--tr-line);
}

.tr-app .tr-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 16px;
  border-bottom: 1px solid var(--tr-line);
}

.tr-app .tr-brand-icon {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  display: block;
}

.tr-app .tr-brand-logo {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 45%, #db2777 75%, #0891b2 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow:
    0 8px 24px rgba(59, 130, 246, 0.4),
    0 0 16px rgba(34, 211, 238, 0.1);
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 0;
  color: #fff;
  flex-shrink: 0;
}

.tr-app .tr-brand-logo svg {
  width: 22px;
  height: 22px;
}

.tr-app .tr-brand-name {
  font-size: 1.063rem;
  line-height: 1.15;
}

.tr-brand-wordmark {
  display: inline-flex;
  align-items: baseline;
  font-family: var(--font-brand);
  font-weight: 800;
  font-size: inherit;
  letter-spacing: -0.05em;
  line-height: 1.1;
  white-space: nowrap;
}

.tr-brand-wordmark__sync {
  color: #f8fafc;
  text-shadow: 0 1px 18px rgba(103, 232, 249, 0.18);
}

.tr-brand-wordmark__pay {
  background: linear-gradient(90deg, #00b4ff 0%, #ff41b4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  padding-right: 0.02em;
}

.tr-app .tr-brand-sub {
  font-size: 0.75rem;
  color: var(--tr-muted);
  margin-top: 2px;
}

.tr-app .tr-side-scroll {
  overflow: auto;
  padding: 12px 10px;
}

.tr-app .tr-side-title {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
  padding: 8px 12px 6px;
}

.tr-app .tr-side-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  margin: 2px 0;
  border-radius: 10px;
  color: #94a3b8;
  text-decoration: none;
  font-weight: 500;
  font-size: 0.875rem;
  transition: background 0.15s, color 0.15s;
}

.tr-app .tr-side-link:hover {
  color: var(--tr-text);
  background: rgba(59, 130, 246, 0.1);
}

.tr-app .tr-side-link.active {
  color: #fff;
  background: linear-gradient(90deg, rgba(59, 130, 246, 0.45), rgba(59, 130, 246, 0.15));
  box-shadow: inset 3px 0 0 var(--tr-purple);
}

.tr-app .tr-side-icon {
  width: 20px;
  text-align: center;
  opacity: 0.85;
}

.tr-app .tr-profile {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-top: 1px solid var(--tr-line);
  background: #0c0c12;
}

.tr-app .tr-profile.tr-profile--stack {
  flex-direction: column;
  align-items: stretch;
}

.tr-app .tr-profile-avatar {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: #312e81;
  color: #ddd6fe;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 0.8125rem;
  flex-shrink: 0;
}

.tr-app .tr-profile-info { min-width: 0; flex: 1; }
.tr-app .tr-profile-name { font-weight: 600; font-size: 0.875rem; color: #f1f5f9; }
.tr-app .tr-profile-email { font-size: 0.75rem; color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.tr-app .tr-main {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}

.tr-app .tr-restricted-banner[hidden] {
  display: none !important;
}

.tr-app .tr-restricted-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 20px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(251, 146, 60, 0.35);
  background: rgba(251, 146, 60, 0.1);
  color: #fdba74;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.4;
}

.tr-app .tr-restricted-banner-icon {
  font-size: 1rem;
  flex-shrink: 0;
}

.tr-app .tr-restricted {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 360px;
  padding: 32px 20px;
}

.tr-app .tr-restricted-card {
  max-width: 420px;
  text-align: center;
  padding: 36px 28px;
  border-radius: 16px;
  border: 1px solid rgba(251, 146, 60, 0.25);
  background: rgba(251, 146, 60, 0.06);
}

.tr-app .tr-restricted-icon {
  font-size: 2.5rem;
  margin-bottom: 14px;
}

.tr-app .tr-restricted-card h2 {
  margin: 0 0 10px;
  font-size: 1.375rem;
  color: #fde68a;
}

.tr-app .tr-restricted-card p {
  margin: 0;
  color: #94a3b8;
  font-size: 0.9375rem;
  line-height: 1.55;
}

.tr-app .tr-shell--restricted .tr-topbar-actions .tr-traffic-chip,
.tr-app .tr-shell--restricted .tr-topbar-actions .tr-turbo-btn {
  pointer-events: none;
  opacity: 0.55;
}

.tr-app .tr-topbar {
  position: relative;
  z-index: 80;
  overflow: visible;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 20px;
  background: #0e0e14;
  border-bottom: 1px solid var(--tr-line);
}

.tr-app .tr-topbar h1 {
  margin: 0;
  font-size: 1.375rem;
  font-weight: 700;
  color: #f8fafc;
}

.tr-app .tr-topbar-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  overflow: visible;
}

.tr-app .tr-rate-chip {
  display: inline-flex;
  align-items: center;
  padding: 5px 13px;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  background: rgba(96, 165, 250, 0.1);
  border: 1px solid rgba(96, 165, 250, 0.25);
  color: #93c5fd;
  white-space: nowrap;
  cursor: default;
  letter-spacing: 0.01em;
}

.tr-app .tr-traffic-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px 4px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--tr-line);
}

.tr-app .tr-traffic-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--tr-muted);
  white-space: nowrap;
  user-select: none;
}

.tr-app .tr-turbo-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 8px;
  border: 1px solid rgba(251, 191, 36, 0.35);
  background: rgba(251, 191, 36, 0.08);
  color: #fcd34d;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.tr-app .tr-turbo-btn:hover:not(:disabled) {
  background: rgba(251, 191, 36, 0.16);
  border-color: rgba(251, 191, 36, 0.55);
  color: #fde68a;
}

.tr-app .tr-turbo-btn:disabled {
  cursor: default;
  opacity: 0.85;
}

.tr-app .tr-turbo-btn.is-active {
  background: rgba(251, 191, 36, 0.2);
  border-color: rgba(251, 191, 36, 0.65);
  color: #fef3c7;
  box-shadow: 0 0 12px rgba(251, 191, 36, 0.25);
}

.tr-app .tr-turbo-timer {
  font-variant-numeric: tabular-nums;
  font-size: 0.75rem;
  font-weight: 800;
  color: #fbbf24;
  min-width: 2.5rem;
  text-align: right;
}

.tr-app .tr-icon-btn {
  width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  border-radius: 10px;
  border: 1px solid var(--tr-line);
  background: var(--tr-surface);
  color: var(--tr-muted);
  display: grid;
  place-items: center;
  font-size: 1rem;
  position: relative;
  overflow: visible;
}

.tr-app .tr-icon-btn:hover { border-color: #475569; color: var(--tr-text); }

.tr-app .tr-lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px;
  border-radius: 10px;
  border: 1px solid var(--tr-line);
  background: var(--tr-surface);
}

.tr-app .tr-lang-btn {
  min-width: 2rem;
  height: 28px;
  padding: 0 6px;
  border: none;
  border-radius: 7px;
  background: transparent;
  color: var(--tr-muted);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  cursor: pointer;
  line-height: 1;
}

.tr-app .tr-lang-btn:hover {
  color: var(--tr-text);
  background: rgba(148, 163, 184, 0.12);
}

.tr-app .tr-lang-btn.is-active {
  color: var(--tr-text);
  background: rgba(99, 102, 241, 0.22);
  box-shadow: inset 0 0 0 1px rgba(129, 140, 248, 0.35);
}

.tr-app .tr-lang-switch--login {
  margin-left: auto;
}

.tr-login-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-end;
}

.tr-app .tr-bell-badge {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 10px;
  height: 10px;
  padding: 0;
  border-radius: 50%;
  background: #ef4444;
  border: 2px solid #0e0e14;
  pointer-events: none;
  box-sizing: border-box;
}

.tr-app .tr-notif-wrap {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 200;
}

.tr-app .tr-notif-panel {
  display: none;
  width: 320px;
  max-height: 420px;
  overflow-y: auto;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  border-radius: 14px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

.tr-app .tr-notif-wrap.open .tr-notif-panel { display: block; }

.tr-app .tr-notif-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--tr-muted);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--tr-line);
  position: sticky;
  top: 0;
  background: var(--tr-surface);
}

.tr-app .tr-notif-close {
  background: none; border: none;
  color: var(--tr-muted); cursor: pointer;
  font-size: 0.875rem; padding: 2px 6px;
  border-radius: 6px;
}
.tr-app .tr-notif-close:hover { color: var(--tr-text); }

.tr-app .tr-notif-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: background 0.1s;
}
.tr-app .tr-notif-item:hover { background: rgba(255,255,255,0.03); }
.tr-app .tr-notif-item:last-child { border-bottom: none; }

.tr-app .tr-notif-item--unread {
  background: rgba(59, 130, 246, 0.06);
  border-left: 2px solid var(--tr-purple);
}

.tr-app .tr-notif-icon { font-size: 1.1rem; flex-shrink: 0; line-height: 1.4; }

.tr-app .tr-notif-body { flex: 1; min-width: 0; }

.tr-app .tr-notif-title {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--tr-text);
  margin-bottom: 2px;
}

.tr-app .tr-notif-text {
  font-size: 0.8rem;
  color: #94a3b8;
  line-height: 1.45;
}

.tr-app .tr-notif-time {
  font-size: 0.75rem;
  color: var(--tr-muted);
  margin-top: 2px;
}

.tr-app .tr-notif-empty,
.tr-app .tr-notif-loading {
  padding: 24px;
  text-align: center;
  color: var(--tr-muted);
  font-size: 0.875rem;
}

.tr-app .tr-bell-wrap {
  position: relative;
  overflow: visible;
}

@keyframes tr-bell-shake {
  0%   { transform: rotate(0deg); }
  15%  { transform: rotate(18deg); }
  30%  { transform: rotate(-16deg); }
  45%  { transform: rotate(12deg); }
  60%  { transform: rotate(-8deg); }
  75%  { transform: rotate(4deg); }
  100% { transform: rotate(0deg); }
}

.tr-app .tr-bell-shake {
  animation: tr-bell-shake 0.6s ease;
  transform-origin: top center;
  display: inline-block;
}


  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--tr-purple);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  display: grid;
  place-items: center;
}

.tr-app .tr-balance-wrap {
  position: relative;
}

.tr-app .tr-balance-chip {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding: 6px 14px;
  border-radius: 10px;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  line-height: 1.25;
  cursor: pointer;
  min-width: 120px;
  color: inherit;
  text-align: right;
}

.tr-app .tr-balance-chip:hover { border-color: #475569; }

.tr-app .tr-balance-wrap.open .tr-balance-chip {
  border-color: rgba(59, 130, 246, 0.55);
  background: #14141c;
}

.tr-app .tr-balance-chip span:first-child {
  font-size: 0.75rem;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.tr-app .tr-balance-chip strong {
  font-size: 1rem;
  color: #f8fafc;
  font-variant-numeric: tabular-nums;
}

.tr-app .tr-balance-chevron {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.75rem;
  color: #64748b;
  transition: transform 0.15s;
}

.tr-app .tr-balance-chip { position: relative; padding-right: 26px; }

.tr-app .tr-balance-wrap.open .tr-balance-chevron {
  transform: translateY(-50%) rotate(180deg);
}

.tr-app .tr-balance-menu {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 220px;
  padding: 8px;
  border-radius: 12px;
  background: #12121a;
  border: 1px solid var(--tr-line);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
  z-index: 120;
}

.tr-app .tr-balance-wrap.open .tr-balance-menu { display: block; }

.tr-app .tr-balance-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
  border-radius: 8px;
}

.tr-app .tr-balance-row:hover { background: rgba(59, 130, 246, 0.08); }

.tr-app .tr-balance-row span {
  font-size: 0.8125rem;
  color: #94a3b8;
}

.tr-app .tr-balance-row strong {
  font-size: 0.875rem;
  color: #f8fafc;
  font-variant-numeric: tabular-nums;
}

.tr-app .tr-balance-row strong.tr-bal-profit { color: #4ade80; }

.tr-app .tr-balance-transfer {
  display: block;
  width: calc(100% - 16px);
  margin: 4px 8px 8px;
  padding: 10px 12px;
  border: 1px solid rgba(34, 197, 94, 0.35);
  border-radius: 10px;
  background: rgba(34, 197, 94, 0.12);
  color: #86efac;
  font-size: 0.8125rem;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
}

.tr-app .tr-balance-transfer:hover:not(:disabled) {
  background: rgba(34, 197, 94, 0.2);
  border-color: rgba(34, 197, 94, 0.55);
}

.tr-app .tr-balance-transfer:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.tr-app .tr-profit-transfer-body {
  display: grid;
  gap: 14px;
}

.tr-app .tr-profit-transfer-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.tr-app .tr-profit-transfer-stats div {
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--tr-line);
  background: var(--tr-surface-2);
}

.tr-app .tr-profit-transfer-stats strong {
  display: block;
  margin-top: 6px;
  font-size: 1.125rem;
  color: #f8fafc;
}

.tr-app .tr-profit-transfer-btn {
  justify-self: start;
  border-color: rgba(34, 197, 94, 0.45);
  background: rgba(34, 197, 94, 0.14);
  color: #86efac;
  font-weight: 700;
}

.tr-app .tr-profit-transfer-btn:hover:not(:disabled) {
  background: rgba(34, 197, 94, 0.22);
}

.tr-app .tr-profit-transfer-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

@media (max-width: 900px) {
  .tr-app .tr-profit-transfer-stats {
    grid-template-columns: 1fr;
  }
}

/* Пополнение USDT (TRC20): QR + адрес + копирование */
.tr-app .tr-topup-body {
  display: flex;
  align-items: center;
  gap: 20px;
}

.tr-app .tr-topup-qr {
  flex-shrink: 0;
  padding: 10px;
  border-radius: 14px;
  background: #ffffff;
  line-height: 0;
}

.tr-app .tr-topup-qr-img {
  display: block;
  border-radius: 6px;
}

.tr-app .tr-topup-info {
  display: grid;
  gap: 10px;
  min-width: 0;
  flex: 1;
}

.tr-app .tr-topup-network {
  justify-self: start;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #f0b429;
  background: rgba(240, 180, 41, 0.12);
  border: 1px solid rgba(240, 180, 41, 0.28);
}

.tr-app .tr-topup-addr-row {
  display: flex;
  align-items: stretch;
  gap: 10px;
  flex-wrap: wrap;
}

.tr-app .tr-topup-addr {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid var(--tr-line);
  background: var(--tr-surface-2);
  color: #f8fafc;
  font-size: 0.95rem;
  word-break: break-all;
}

.tr-app .tr-topup-copy {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 16px;
  border-radius: 12px;
  border: 1px solid rgba(46, 230, 160, 0.4);
  background: rgba(46, 230, 160, 0.12);
  color: #86efac;
  font-weight: 700;
  cursor: pointer;
}

.tr-app .tr-topup-copy:hover {
  background: rgba(46, 230, 160, 0.2);
}

.tr-app .tr-topup-copy svg {
  width: 17px;
  height: 17px;
}

.tr-app .tr-topup-hint {
  margin: 0;
  font-size: 0.85rem;
  line-height: 1.45;
}

.tr-app .tr-topup-empty {
  padding: 8px 2px;
}

@media (max-width: 720px) {
  .tr-app .tr-topup-body {
    flex-direction: column;
    align-items: stretch;
  }
  .tr-app .tr-topup-qr {
    align-self: center;
  }
  .tr-app .tr-topup-copy {
    flex: 1;
    justify-content: center;
  }
}

.tr-app .tr-profit-pill {
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.15);
  border: 1px solid rgba(34, 197, 94, 0.35);
  color: #4ade80;
  font-weight: 700;
  font-size: 0.875rem;
}

.tr-app .tr-workspace {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
  padding: 16px 20px 24px;
  overflow: hidden;
}

.tr-app #tr-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
}

/* Full-height layout for every trader tab */
.tr-app .tr-page {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
  gap: 16px;
}

.tr-app .tr-page > .payin-kpi-grid,
.tr-app .tr-page > .tr-dash-metrics,
.tr-app .tr-page > .tr-dash-toolbar,
.tr-app .tr-page > .tr-dash-charts,
.tr-app .tr-page > .tr-dash-mini-grid,
.tr-app .tr-page > .kpis,
.tr-app .tr-page > .kpis-3,
.tr-app .tr-page > .toolbar,
.tr-app .tr-page > .stats-row,
.tr-app .tr-page > .section-intro {
  flex-shrink: 0;
  margin-bottom: 0 !important;
}

.tr-app .tr-page > .payin-kpi-grid,
.tr-app .tr-page > .payin-panel.orders-panel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.tr-app .tr-page > .payin-panel,
.tr-app .tr-page > .panel,
.tr-app .tr-page > section.panel,
.tr-app .tr-page > .tr-settings-page,
.tr-app .tr-page > section.tr-settings-table,
.tr-app .tr-page > .tr-dash-tables,
.tr-app .tr-page > .table-panel.merchants-table,
.tr-app .tr-page > .table-panel.merchants-panel {
  flex: 1;
  min-height: 0;
}

.tr-app .tr-page > .panel,
.tr-app .tr-page > section.panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  margin-top: 0 !important;
}

.tr-app .tr-page .panel-header,
.tr-app .tr-page .payin-panel-title,
.tr-app .tr-page .payin-toolbar,
.tr-app .tr-page .payin-table-footer,
.tr-app .tr-page .tr-dash-table-head,
.tr-app .tr-page .tr-dash-table-link {
  flex-shrink: 0;
}

.tr-app .tr-page .panel > .table-wrap,
.tr-app .tr-page .panel > .empty,
.tr-app .tr-page .panel > .panel-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.tr-app .tr-page .panel-body {
  display: flex;
  flex-direction: column;
}

.tr-app .tr-page--dashboard {
  overflow: auto;
}

/* Выплаты: высоты «Стакан» : «Виплати» = 4 : 3, каждая таблица скроллится внутри. */
.tr-app .tr-page--payout > .payout-pool-panel {
  flex: 4 1 0;
  min-height: 0;
}

.tr-app .tr-page--payout > .payout-pool-panel .payin-table-wrap {
  flex: 1;
  min-height: 0;
  max-height: none;
}

.tr-app .tr-page--payout > .payout-pool-panel .payin-table-wrap .table-wrap {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}

.tr-app .tr-page--payout > .payout-orders-panel {
  flex: 3 1 0;
  min-height: 0;
}

.tr-app .tr-page--payout > .payout-orders-panel .payin-table-wrap .table-wrap {
  overflow-y: auto;
}

/* KPI */
.tr-app .payin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 0;
  flex-shrink: 0;
}

.tr-app .payin-kpi {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 14px;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
}

.tr-app .payin-kpi-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 1.25rem;
  flex-shrink: 0;
}

.tr-app .payin-kpi.purple .payin-kpi-icon { background: rgba(59, 130, 246, 0.2); color: #7ab0ff; }
.tr-app .payin-kpi.green .payin-kpi-icon { background: rgba(34, 197, 94, 0.15); color: #4ade80; }
.tr-app .payin-kpi.orange .payin-kpi-icon { background: rgba(249, 115, 22, 0.15); color: #fb923c; }
.tr-app .payin-kpi.red .payin-kpi-icon { background: rgba(239, 68, 68, 0.15); color: #f87171; }
.tr-app .payin-kpi.blue .payin-kpi-icon { background: rgba(59, 130, 246, 0.15); color: #60a5fa; }

.tr-app .payin-kpi-label { color: var(--tr-muted); font-size: 0.8125rem; margin-bottom: 6px; }
.tr-app .payin-kpi-value { font-size: 1.625rem; font-weight: 800; color: #f8fafc; line-height: 1.12; }
.tr-app .payin-kpi-hint { font-size: 0.75rem; margin-top: 6px; font-weight: 600; }
.tr-app .payin-kpi-hint.up { color: #4ade80; }
.tr-app .payin-kpi-hint.down { color: #f87171; }

/* PayIn panel */
.tr-app .payin-panel {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  border-radius: 14px;
  overflow: hidden;
}

.tr-app .payin-panel-title {
  padding: 16px 20px 0;
  font-size: 1.063rem;
  font-weight: 700;
  color: #f8fafc;
  flex-shrink: 0;
}

.tr-app .payin-toolbar {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--tr-line);
  min-width: 0;
}

.tr-app .payin-filter-tabs { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }

.tr-app .payin-filter-tab {
  border: 1px solid var(--tr-line);
  background: var(--tr-surface-2);
  color: var(--tr-muted);
  border-radius: 6px;
  padding: 3px 8px;
  min-height: 24px;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.2;
}

.tr-app .payin-filter-tab.active {
  background: linear-gradient(180deg, #1e40af, #1e3a8a);
  border-color: rgba(59, 130, 246, 0.6);
  color: #fff;
}

.tr-app .payin-filter-count { opacity: 0.9; margin-left: 2px; }

.tr-app .payin-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 180px;
  justify-content: flex-end;
  min-width: 0;
}

.tr-app .payin-search {
  max-width: 280px;
  min-width: 0;
  flex: 1 1 120px;
  background: #0a0a10;
  border-color: var(--tr-line);
  border-radius: 10px;
}

.tr-app .payin-view-toggle {
  display: flex;
  border: 1px solid var(--tr-line);
  border-radius: 8px;
  overflow: hidden;
}

.tr-app .payin-view-btn {
  width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border: none;
  border-radius: 0;
  background: var(--tr-surface-2);
  color: var(--tr-muted);
}

.tr-app .payin-view-btn.active {
  background: var(--tr-purple-soft);
  color: #93c5fd;
}

.tr-app .payin-table-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  padding: 0;
  overflow: hidden;
}

.tr-app .payin-table-wrap .table-wrap {
  flex: 1;
  border: none;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  /* Горизонтальный скролл запрещён: таблица всегда table-layout:fixed; width:100%,
     поэтому по ширине переполнения быть не должно. Так исключаем появление/исчезновение
     горизонтального скроллбара при переключении вкладок. */
  overflow-x: hidden;
  overflow-y: auto;
  /* Резервируем место под вертикальный скроллбар, чтобы при переключении
     вкладок Активные/Архив (когда меняется число строк) таблица не «дёргалась»
     по ширине из-за появления/исчезновения скроллбара. */
  scrollbar-gutter: stable;
}

.tr-app .payin-table-wrap table.payin-orders-table {
  width: 100%;
  max-width: 100%;
  min-width: 0 !important;
  table-layout: fixed;
}

.tr-app .payin-table-wrap table { width: 100%; max-width: 100%; min-width: 0 !important; }
.tr-app .payin-table-wrap th {
  padding: 10px 8px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
  background: #0e0e14;
  border-bottom: 1px solid var(--tr-line);
}

.tr-app .payin-table-wrap td {
  padding: 10px 8px;
  border-bottom: 1px solid var(--tr-line);
  vertical-align: middle;
  font-size: 0.8125rem;
  line-height: var(--leading-snug);
}

.tr-app .payin-table-wrap tbody tr:hover { background: rgba(59, 130, 246, 0.04); }

.tr-app .payin-req-id { font-weight: 600; color: #f1f5f9; font-size: 0.875rem; }
.tr-app .payin-req-pair { font-size: 0.75rem; color: #64748b; margin-top: 3px; }
.tr-app .payin-amount { font-weight: 700; color: #f8fafc; }
.tr-app .payin-sub-amount { color: #64748b; font-size: 0.8125rem; font-weight: 500; margin-top: 3px; }
.tr-app .payin-profit { color: #4ade80; font-size: 0.8125rem; font-weight: 600; margin-top: 3px; }

.tr-app .status {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 700;
  line-height: 1.25;
}

.tr-app .status.paid { background: rgba(34, 197, 94, 0.15); color: #4ade80; }
.tr-app .status.under-review,
.tr-app .status.customer-claimed-paid { background: rgba(249, 115, 22, 0.15); color: #fb923c; }
.tr-app .status.waiting-payment { background: rgba(59, 130, 246, 0.15); color: #60a5fa; }
.tr-app .status.expired,
.tr-app .status.cancelled { background: rgba(239, 68, 68, 0.12); color: #f87171; }
.tr-app .status.payin-dir { background: rgba(59, 130, 246, 0.15); color: #7ab0ff; }
/* PayOut «В роботі» — отдельный циан, чтобы не сливался с оранжевой «На перевірці» */
.tr-app .status.in-work { background: rgba(34, 211, 238, 0.14); color: #22d3ee; }

.tr-app .payin-details-btn {
  font-size: 0.8125rem;
  padding: 6px 12px;
  min-height: 30px;
  border-radius: 8px;
}

.tr-app .payin-menu-btn {
  width: 30px;
  min-height: 30px;
  padding: 0;
  border-radius: 8px;
  font-size: 1.063rem;
  line-height: 1;
}

.tr-app .payin-table-footer {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px;
  border-top: 1px solid var(--tr-line);
  background: #0e0e14;
}

.tr-app .payin-page-btn.active {
  background: linear-gradient(180deg, #1e40af, #1e3a8a);
  border-color: rgba(59, 130, 246, 0.6);
  color: #fff;
}

.tr-app .panel {
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  border-radius: 14px;
  overflow: hidden;
}

.tr-app .kpi {
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  border-radius: 14px;
}

@media (max-width: 1200px) {
  .tr-app .payin-kpi-grid { grid-template-columns: repeat(3, 1fr); }
}

/* Trader Dashboard */
.tr-app .tr-dash-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 0;
}

.tr-app .tr-dash-metric {
  padding: 16px 18px;
  border-radius: 14px;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  min-height: 130px;
  display: flex;
  flex-direction: column;
}

.tr-app .tr-dash-metric-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.tr-app .tr-dash-metric-icon { opacity: 0.9; }
.tr-app .tr-dash-metric-title { font-size: 0.8125rem; color: var(--tr-muted); font-weight: 600; }
.tr-app .tr-dash-metric-value { font-size: 1.5rem; font-weight: 800; color: #f8fafc; line-height: 1.15; }
.tr-app .tr-dash-metric-sub { font-size: 0.8125rem; color: #64748b; margin-top: 4px; }
.tr-app .tr-dash-metric-foot {
  margin-top: auto;
  padding-top: 10px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
}

.tr-app .tr-dash-trend { font-size: 0.75rem; font-weight: 700; }
.tr-app .tr-dash-trend.up { color: #4ade80; }
.tr-app .tr-dash-trend.down { color: #f87171; }

.tr-app .tr-dash-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 0;
}

.tr-app .tr-dash-filters { display: flex; flex-wrap: wrap; gap: 8px; }

.tr-app .tr-dash-filter {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--tr-line);
  background: var(--tr-surface);
  color: var(--tr-muted);
  text-decoration: none;
  font-size: 0.8125rem;
  font-weight: 600;
}

.tr-app .tr-dash-filter strong { color: #f8fafc; }
.tr-app .tr-dash-filter.green { border-color: rgba(34, 197, 94, 0.35); color: #86efac; }
.tr-app .tr-dash-filter.orange { border-color: rgba(249, 115, 22, 0.35); color: #fdba74; }

.tr-app .tr-dash-range {
  font-size: 0.8125rem;
  color: #94a3b8;
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid var(--tr-line);
  background: var(--tr-surface);
}

.tr-app .tr-dash-charts {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 14px;
  margin-bottom: 0;
}

.tr-app .tr-dash-chart-card {
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  border-radius: 14px;
  padding: 16px;
  min-height: 220px;
}

.tr-app .tr-dash-chart-card.wide { grid-column: span 1; }

.tr-app .tr-dash-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.tr-app .tr-dash-chart-head h3 { margin: 0; font-size: 0.938rem; color: #f1f5f9; }

.tr-app .tr-dash-line-chart { width: 100%; height: 150px; display: block; }

.tr-app .tr-chart-label { fill: #64748b; font-size: 0.75rem; }

.tr-app .tr-dash-volume-total {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 12px;
}

.tr-app .tr-dash-volume-total strong { font-size: 1.25rem; color: #f8fafc; }

.tr-app .tr-dash-bars {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  height: 120px;
  padding-top: 8px;
}

.tr-app .tr-dash-bar-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  height: 100%;
  justify-content: flex-end;
}

.tr-app .tr-dash-bar-col span { font-size: 0.688rem; color: #64748b; }
.tr-app .tr-dash-bar {
  width: 100%;
  max-width: 28px;
  border-radius: 6px 6px 2px 2px;
  background: linear-gradient(180deg, #7ab0ff, #3b82f6);
  min-height: 8px;
}

.tr-app .tr-dash-donut-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}

.tr-app .tr-dash-legend { flex: 1; min-width: 140px; }

.tr-app .tr-dash-mini-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 0;
}

.tr-app .tr-dash-mini {
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
}

.tr-app .tr-dash-mini-label { font-size: 0.75rem; color: #64748b; margin-bottom: 4px; }
.tr-app .tr-dash-mini-value { font-size: 1.375rem; font-weight: 800; color: #f8fafc; line-height: 1.12; }
.tr-app .tr-dash-mini-hint { font-size: 0.75rem; margin-top: 4px; font-weight: 600; }
.tr-app .tr-dash-mini-hint.up { color: #4ade80; }
.tr-app .tr-dash-mini-hint.down { color: #f87171; }

.tr-app .tr-dash-tables {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  min-height: 0;
  margin-bottom: 0;
}

.tr-app .tr-dash-table-card {
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.tr-app .tr-dash-table-head {
  padding: 14px 16px;
  border-bottom: 1px solid var(--tr-line);
}

.tr-app .tr-dash-table-head h3 { margin: 0; font-size: 0.938rem; color: #f1f5f9; }

.tr-app .tr-dash-table-card .table-wrap { border: none; }
.tr-app .tr-dash-table-card th {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  background: #0e0e14;
}

.tr-app .tr-dash-table-card td {
  font-size: 0.875rem;
  line-height: var(--leading-snug);
}

.tr-app .tr-dash-table-link {
  display: block;
  padding: 12px 16px;
  border-top: 1px solid var(--tr-line);
  color: #7ab0ff;
  text-decoration: none;
  font-size: 0.8125rem;
  font-weight: 600;
}

.tr-app .tr-dash-table-card .table-wrap,
.tr-app .tr-dash-table-card > .empty {
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.tr-app .requisites-table > .table-wrap,
.tr-app .requisites-table > .empty {
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.tr-app .tr-page > .kpis,
.tr-app .tr-page > .kpis-3 {
  margin-bottom: 0 !important;
}

.tr-app .tr-dash-table-link:hover { color: #93c5fd; }

.tr-app .payin-beneficiary { margin-top: 3px; }
.tr-app .payin-expiry {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #fbbf24;
}
.tr-app .payin-expiry--soon { color: #fb7185; }
.tr-app .payin-expiry-at { font-size: 0.688rem; margin-top: 3px; }

.tr-app .payin-panel.orders-panel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  align-self: stretch;
}

.tr-app .orders-panel .payin-table-wrap,
.tr-app .orders-panel .payin-table-wrap .table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.tr-app .payin-orders-table {
  width: 100%;
  max-width: 100%;
  min-width: 0 !important;
  table-layout: fixed;
  border-collapse: collapse;
}

.tr-app .payin-orders-table th,
.tr-app .payin-orders-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 10px 8px;
  vertical-align: middle;
  word-break: break-word;
}

.tr-app .payin-orders-table th:first-child,
.tr-app .payin-orders-table td:first-child {
  white-space: nowrap;
  font-size: 0.75rem;
}

.tr-app .payin-orders-table th:nth-child(3),
.tr-app .payin-orders-table td:nth-child(3) {
  white-space: nowrap;
  text-align: center;
}

.tr-app .payin-orders-table th:nth-child(4),
.tr-app .payin-orders-table td:nth-child(4) {
  white-space: nowrap;
}

.tr-app .payin-orders-table th:last-child,
.tr-app .payin-orders-table td.payin-actions {
  width: 44px;
  min-width: 44px;
  max-width: 44px;
  overflow: visible;
  padding-left: 6px;
  padding-right: 6px;
  text-align: center;
}

.tr-app .payin-orders-table td:nth-child(6) {
  white-space: normal;
  line-height: 1.2;
  font-size: 0.75rem;
}

.tr-app .payin-orders-table .payin-expiry-at {
  font-size: 0.625rem;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tr-app .payin-orders-table .status {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  vertical-align: middle;
}

.tr-app .payin-orders-table td:nth-child(2) .payin-req-id,
.tr-app .payout-orders-table td:nth-child(1) .payin-req-id,
.tr-app .payout-pool-table td:nth-child(1) .payin-req-id,
.tr-app .payin-orders-table td:nth-child(5) .mono,
.tr-app .payout-orders-table td:nth-child(5) .mono,
.tr-app .payout-orders-table td:nth-child(6) .mono,
.tr-app .payin-orders-table td:nth-child(5) .payin-beneficiary {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  max-width: 100%;
}

.tr-app .payin-orders-table .payin-amount,
.tr-app .payin-orders-table .payin-sub-amount {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tr-app .payin-actions {
  text-align: center;
}

.tr-app .payin-actions.actions-compact {
  justify-content: center;
  align-items: center;
}

.tr-app .payin-action-spacer {
  display: inline-block;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
}

.tr-app .payin-confirm-btn {
  min-width: 32px;
  min-height: 32px;
  padding: 0;
  margin-left: 0;
  border-color: rgba(34, 197, 94, 0.45);
  color: #4ade80;
  font-weight: 700;
  flex-shrink: 0;
}
.tr-app .payin-confirm-btn:hover {
  border-color: rgba(34, 197, 94, 0.7);
  color: #86efac;
}

/* Таблица выплат: столбец действий на всю ширину колонки (23% из colWidths),
   снимаем зажим в 44px, унаследованный от .payin-orders-table */
.tr-app .payout-orders-table th:last-child,
.tr-app .payout-orders-table td.payout-actions {
  width: auto;
  min-width: 0;
  max-width: none;
  text-align: left;
  white-space: normal;
  /* Обрезаем переполнение, чтобы контент кнопок не выходил за пределы колонки
     и не вызывал горизонтальный скролл / «дёрганье» при переключении вкладок. */
  overflow: hidden;
}

/* Ячейка действий остаётся обычной table-cell, чтобы table-layout: fixed
   удерживал ширину колонки и таблица не дёргалась при смене вкладок.
   Flex-стопку кнопок выносим во внутренний контейнер. */
.tr-app .payout-orders-table td.payout-actions,
.tr-app .payout-pool-table td.payout-actions {
  padding: 8px 10px;
  vertical-align: middle;
}

/* Ячейка действий — блочная, чтобы кнопки не сжимались flex-правилами .actions-compact */
.tr-app td.payout-actions.actions-compact {
  display: table-cell;
  white-space: normal;
}

/* Кнопки действий — одинаковая ширина (по «Завантажити квитанцію»), блок по центру ячейки */
.tr-app td.payout-actions .payout-actions-inner {
  --payout-action-min-width: 26ch;
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: stretch;
  width: max-content;
  min-width: min(100%, var(--payout-action-min-width));
  max-width: 100%;
  margin-inline: auto;
}

/* Базовый вид всех кнопок выплат */
.tr-app td.payout-actions .payout-actions-inner button.payout-claim-btn,
.tr-app td.payout-actions .payout-actions-inner button.payout-close-btn,
.tr-app td.payout-actions .payout-actions-inner button.payout-release-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 30px;
  margin: 0;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  white-space: normal;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

/* Акцентная — «Взять выплату» */
.tr-app .payout-orders-table .payout-claim-btn {
  background: var(--tr-purple);
  border-color: var(--tr-purple);
  color: #ffffff;
}
.tr-app .payout-orders-table .payout-claim-btn:hover {
  background: #2563eb;
  border-color: #2563eb;
}

/* Пул выплат: «Взять в работу» — компактная акцентная кнопка */
.tr-app .payout-pool-table td.payout-actions .payout-actions-inner button.payout-claim-btn {
  background: linear-gradient(135deg, var(--tr-purple) 0%, #2563eb 100%);
  border-color: var(--tr-purple);
  color: #ffffff;
  box-shadow: 0 2px 8px var(--tr-purple-soft);
}
.tr-app .payout-pool-table .payout-claim-btn:hover {
  background: linear-gradient(135deg, #5b9dff 0%, #3b82f6 100%);
  border-color: #5b9dff;
  box-shadow: 0 3px 10px var(--tr-purple-soft);
}
.tr-app .payout-pool-table .payout-claim-btn:active {
  box-shadow: 0 1px 4px var(--tr-purple-soft);
}

/* Основная — «Завантажити квитанцію» */
.tr-app .payout-orders-table .payout-close-btn {
  background: linear-gradient(135deg, #1fbf86 0%, #15803d 100%);
  border-color: #2ee6a0;
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(34, 197, 94, 0.18);
}
.tr-app .payout-orders-table .payout-close-btn:hover {
  background: linear-gradient(135deg, #2ee6a0 0%, #1fbf86 100%);
  border-color: #4ade80;
  box-shadow: 0 3px 10px rgba(34, 197, 94, 0.26);
}
.tr-app .payout-orders-table .payout-close-btn:active {
  box-shadow: 0 1px 4px rgba(34, 197, 94, 0.16);
}

/* Предупреждающая — «Повернути в стакан» */
.tr-app .payout-orders-table .payout-release-btn {
  background: rgba(249, 115, 22, 0.14);
  border-color: rgba(249, 115, 22, 0.55);
  color: #fdba74;
}
.tr-app .payout-orders-table .payout-release-btn:hover {
  background: rgba(249, 115, 22, 0.24);
  border-color: #fb923c;
  color: #fed7aa;
  box-shadow: 0 2px 8px rgba(249, 115, 22, 0.14);
}
.tr-app .payout-orders-table .payout-release-btn:active {
  box-shadow: none;
}

/* Компактная типографика для общих компонентов styles.css */
.tr-app button,
.tr-app input,
.tr-app select,
.tr-app textarea {
  font-size: 0.8125rem;
}

.tr-app th { font-size: 0.75rem; }
.tr-app td { font-size: 0.8125rem; }
.tr-app .mono { font-size: 0.8125rem; }
.tr-app .faint { font-size: 0.75rem; }
.tr-app .status { font-size: 0.6875rem; min-height: 1.125rem; }
.tr-app .stat-pill { font-size: 0.8125rem; min-height: 1.625rem; }
.tr-app .panel-header h2 { font-size: 0.938rem; }
.tr-app .panel-header { min-height: 2.25rem; padding: 0.5rem 0.75rem; }
.tr-app .kpi span { font-size: 0.8125rem; }
.tr-app .kpi strong { font-size: 1.313rem; }
.tr-app .kpi .faint { font-size: 0.75rem; }
.tr-app .form-row label { font-size: 0.8125rem; }
.tr-app .payin-kpi-icon { font-size: 1.063rem; }
.tr-app .payin-filter-tab { font-size: 0.75rem; min-height: 1.5rem; padding: 3px 8px; }
.tr-app .payin-details-btn { font-size: 0.8125rem; min-height: 1.625rem; }
.tr-app .payin-total-count { font-size: 0.8125rem; }
.tr-app .tr-balance-item strong { font-size: 0.938rem; }
.tr-app .section-intro h2 { font-size: 1.25rem; }
.tr-app .section-intro p { font-size: 0.875rem; }

@media (max-width: 1200px) {
  .tr-app .tr-dash-metrics { grid-template-columns: repeat(2, 1fr); }
  .tr-app .tr-dash-charts { grid-template-columns: 1fr; }
  .tr-app .tr-dash-mini-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
  .tr-app .tr-shell {
    min-height: 100dvh;
    padding-left: 0;
  }
  .tr-app .tr-sidebar {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    min-height: 0;
  }
  .tr-app .tr-main {
    width: 100%;
    max-width: 100%;
    min-height: 0;
  }
  .tr-app .payin-kpi-grid { grid-template-columns: 1fr 1fr; }
  .tr-app .payin-toolbar-right { width: 100%; justify-content: stretch; }
  .tr-app .payin-search { max-width: none; }
  .tr-app .tr-dash-metrics { grid-template-columns: 1fr 1fr; }
  .tr-app .tr-dash-charts { grid-template-columns: 1fr; }
  .tr-app .tr-dash-tables { grid-template-columns: 1fr; }
  .tr-app .tr-dash-mini-grid { grid-template-columns: repeat(2, 1fr); }
  .tr-app .drawer:not(.centered),
  .tr-app .drawer.wide:not(.centered) { width: 100vw; }
  .tr-app .drawer.centered {
    width: min(440px, calc(100vw - 24px));
    max-height: calc(100vh - 24px);
  }
}

/* Shared cabinet content areas (admin / merchant) */
.tr-app #op-content,
.tr-app #mch-content,
.tr-app #tr-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
}

.tr-app .tr-login-wrap {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  background: radial-gradient(1200px 600px at 50% -10%, rgba(59, 130, 246, 0.22), transparent), var(--tr-bg);
  padding: 24px;
}

.tr-app .tr-login-card {
  width: 100%;
  max-width: 380px;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  border-radius: 14px;
  padding: 28px 24px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.35);
  display: grid;
  gap: 12px;
}

.tr-app .tr-login-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 4px;
}

.tr-app .tr-login-brand .tr-brand-icon {
  width: 72px;
  height: 72px;
}

.tr-app .tr-login-brand .tr-brand-name--login,
.tr-app .tr-login-brand .tr-brand-wordmark {
  font-size: 1.5rem;
  letter-spacing: -0.055em;
}

.tr-app .tr-login-brand--lockup {
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 4px;
}

.tr-brand-lockup {
  display: block;
  width: min(100%, 228px);
  height: auto;
}

.tr-app .tr-login-brand .tr-brand-name {
  font-size: 1.35rem;
}

.tr-app .tr-login-brand .tr-brand-wordmark {
  letter-spacing: -0.055em;
}

.tr-app .tr-login-sub { color: var(--tr-muted); font-size: 0.875rem; margin-bottom: 4px; }

.tr-app .tr-login-error {
  background: rgba(239, 68, 68, 0.12);
  color: #fca5a5;
  border: 1px solid rgba(239, 68, 68, 0.35);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 0.8125rem;
}

.tr-app .tr-login-hint { color: #64748b; font-size: 0.75rem; text-align: center; }

.tr-app .tr-login-card button[type="submit"] {
  width: 100%;
  margin-top: 4px;
  min-height: 38px;
  font-weight: 600;
  background: linear-gradient(180deg, #2563eb, #1e40af);
  border-color: rgba(59, 130, 246, 0.6);
}

.tr-app .tr-stat-chip {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding: 6px 14px;
  border-radius: 10px;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  line-height: 1.25;
  min-width: 100px;
}

.tr-app .tr-stat-chip span {
  font-size: 0.75rem;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.tr-app .tr-stat-chip strong {
  font-size: 1rem;
  color: #f8fafc;
  font-variant-numeric: tabular-nums;
}

.tr-app .tr-stat-chip.purple strong { color: #93c5fd; }
.tr-app .tr-stat-chip.green strong { color: #4ade80; }

.tr-app .tr-logout-btn {
  width: 100%;
  margin-top: 8px;
  min-height: 34px;
  font-size: 0.8125rem;
}

.tr-app .headline-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.tr-app .headline-card {
  padding: 18px 20px;
  border-radius: 14px;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
}

.tr-app .headline-card.accent {
  border-color: rgba(59, 130, 246, 0.45);
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.18), var(--tr-surface));
}

.tr-app .headline-num { font-size: 2rem; font-weight: 800; line-height: 1; color: #f8fafc; }
.tr-app .headline-cap { margin-top: 8px; font-size: 0.938rem; font-weight: 600; color: #e2e8f0; }
.tr-app .headline-sub { margin-top: 3px; font-size: 0.8125rem; color: #64748b; }

.tr-app .metric-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tr-app .metric-grid.three { grid-template-columns: repeat(3, 1fr); }

.tr-app .metric {
  padding: 14px 16px;
  border-radius: 12px;
  background: var(--tr-surface-2);
  border: 1px solid var(--tr-line);
}

.tr-app .metric-label { font-size: 0.75rem; color: #64748b; margin-bottom: 6px; }
.tr-app .metric-value { font-size: 1.125rem; font-weight: 700; color: #f8fafc; }
.tr-app .metric-hint { font-size: 0.75rem; color: #64748b; margin-top: 4px; }
.tr-app .metric.purple .metric-value { color: #93c5fd; }
.tr-app .metric.green .metric-value { color: #4ade80; }
.tr-app .metric.orange .metric-value { color: #fb923c; }
.tr-app .metric.red .metric-value { color: #f87171; }

.tr-app .grid.two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.tr-app .stats-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 0;
}

.tr-app .orders-panel-head {
  flex-shrink: 0;
  position: sticky;
  top: 0;
  z-index: 3;
  background: linear-gradient(180deg, var(--tr-surface) 0%, rgba(18, 18, 26, 0.98) 100%);
  border-bottom: 1px solid var(--tr-line);
}

.tr-app .orders-panel > .orders-panel-head {
  padding: 14px 18px;
}

.tr-app .orders-panel > .orders-panel-head.payin-kpi-grid {
  padding: 14px 18px 10px;
  gap: 12px;
}

.tr-app .orders-panel-toolbar {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--tr-surface);
}

.tr-app .tr-page--payin > .orders-panel-head,
.tr-app .tr-page--payout > .orders-panel-head {
  position: sticky;
  top: 0;
  z-index: 3;
  padding-bottom: 4px;
  margin-bottom: -4px;
  background: linear-gradient(180deg, var(--tr-bg) 0%, rgba(10, 10, 15, 0.98) 100%);
}

.tr-app .table-wrap table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #0e0e14;
  box-shadow: 0 1px 0 var(--tr-line);
}

.tr-app .orders-panel .table-wrap table thead th {
  top: 0;
}

.tr-app .table-empty-row td {
  padding: 0;
  border: none;
}

.tr-app .table-empty-row .empty {
  margin: 0;
  border: none;
  border-radius: 0;
  min-height: 120px;
}

.tr-app .stat-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--tr-line);
  background: var(--tr-surface);
  color: var(--tr-muted);
  font-size: 0.8125rem;
}

.tr-app .stat-pill strong { color: #f8fafc; }
.tr-app .stat-pill.green { border-color: rgba(34, 197, 94, 0.35); color: #86efac; }
.tr-app .stat-pill.purple { border-color: rgba(59, 130, 246, 0.35); color: #93c5fd; }
.tr-app .stat-pill.orange { border-color: rgba(249, 115, 22, 0.35); color: #fdba74; }
.tr-app .stat-pill.red { border-color: rgba(239, 68, 68, 0.35); color: #fca5a5; }

.tr-app .table-panel.merchants-table > .table-wrap,
.tr-app .table-panel.merchants-panel > .table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: auto;
}

.tr-app .merchants-panel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  align-self: stretch;
}

.tr-app .merchants-panel-head {
  flex-shrink: 0;
  display: grid;
  gap: 12px;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--tr-line);
}

.tr-app .merchants-panel-head .section-intro { margin: 0; }
.tr-app .merchants-panel-head .section-intro h2 { margin: 0 0 4px; }
.tr-app .merchants-panel-head .section-intro p { margin: 0; }
.tr-app .merchants-panel-head .kpis { margin: 0; }
.tr-app .merchants-panel-head .toolbar { margin: 0; }

.tr-app .kpis.kpis--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tr-app table.merchants-grid {
  width: 100%;
  max-width: 100%;
  min-width: 0 !important;
  table-layout: fixed;
}

.tr-app table.merchants-grid th,
.tr-app table.merchants-grid td {
  padding: 8px 6px;
  font-size: 0.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  word-break: break-word;
}

.tr-app table.merchants-grid th:nth-child(1),
.tr-app table.merchants-grid td:nth-child(1) {
  white-space: nowrap;
}

.tr-app table.merchants-grid th:nth-child(2),
.tr-app table.merchants-grid td:nth-child(2) {
  width: 56px;
  white-space: nowrap;
}

.tr-app table.merchants-grid th:nth-child(3),
.tr-app table.merchants-grid td:nth-child(3) {
  white-space: normal;
  line-height: 1.25;
}

.tr-app table.merchants-grid .amount-cell {
  white-space: nowrap;
  font-size: 0.688rem;
}

.tr-app table.merchants-grid .amount-cell .faint {
  font-size: 0.625rem;
}

.tr-app table.merchants-grid th:nth-child(4),
.tr-app table.merchants-grid td:nth-child(4),
.tr-app table.merchants-grid th:nth-child(5),
.tr-app table.merchants-grid td:nth-child(5),
.tr-app table.merchants-grid th:nth-child(10),
.tr-app table.merchants-grid td:nth-child(10),
.tr-app table.merchants-grid th:nth-child(14),
.tr-app table.merchants-grid td:nth-child(14) {
  white-space: nowrap;
}

.tr-app table.merchants-grid th:last-child,
.tr-app table.merchants-grid td:last-child {
  width: 72px;
  min-width: 72px;
  overflow: visible;
  white-space: nowrap;
  text-align: center;
}

.tr-app table.merchants-grid td:last-child .secondary {
  padding: 5px 8px;
  font-size: 0.688rem;
}

.tr-app .merchant-id-code {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.688rem;
}

.tr-app .table-panel,
.tr-app .requisites-table {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--tr-surface);
  border: 1px solid var(--tr-line);
  border-radius: 14px;
  overflow: hidden;
}

.tr-app .table-panel > .table-wrap,
.tr-app .table-panel > .empty,
.tr-app .requisites-table > .table-wrap,
.tr-app .requisites-table > .empty {
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.tr-app .toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 0;
}

.tr-app .req-switch-cell {
  width: 56px;
  text-align: center;
  vertical-align: middle;
}

.tr-app button.req-switch,
.tr-app .req-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  width: 44px;
  height: 24px;
  min-height: 0;
  cursor: pointer;
  flex-shrink: 0;
  border: none !important;
  background: transparent !important;
  background-image: none !important;
  padding: 0 !important;
  margin: 0;
  outline: none;
  overflow: hidden;
  appearance: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  box-shadow: none !important;
  border-radius: 999px !important;
  color: inherit;
}

.tr-app button.req-switch:hover,
.tr-app button.req-switch:active,
.tr-app button.req-switch:focus {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}

.tr-app .req-switch:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.tr-app .req-switch-input {
  display: none !important;
}

.tr-app .req-switch-slider {
  position: absolute;
  inset: 0;
  background: #3f3f46;
  border-radius: 999px;
  transition: background 0.2s ease;
}

.tr-app .req-switch-slider::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #e4e4e7;
  transition: transform 0.2s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

.tr-app .req-switch.is-on .req-switch-slider,
.tr-app .req-switch[aria-checked="true"] .req-switch-slider {
  background: #2ee6a0;
}

.tr-app .req-switch.is-on .req-switch-slider::before,
.tr-app .req-switch[aria-checked="true"] .req-switch-slider::before {
  transform: translateX(20px);
}

.tr-app button.req-switch.tr-traffic-switch {
  width: 40px;
  height: 22px;
  min-height: 22px;
}

.tr-app button.req-switch.tr-traffic-switch .req-switch-slider::before {
  width: 16px;
  height: 16px;
  left: 3px;
  top: 3px;
  transform: none;
}

.tr-app button.req-switch.tr-traffic-switch.is-on .req-switch-slider::before,
.tr-app button.req-switch.tr-traffic-switch[aria-checked="true"] .req-switch-slider::before {
  transform: translateX(18px);
}

.tr-app .req-switch:focus-visible .req-switch-slider {
  outline: 2px solid rgba(34, 197, 94, 0.55);
  outline-offset: 2px;
}

.tr-app .tr-settings-2fa-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  background: transparent;
}

.tr-app .req-status {
  display: inline-block;
  min-width: 2.5rem;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-align: center;
}

.tr-app .req-status-on {
  background: rgba(34, 197, 94, 0.15);
  color: #86efac;
}

.tr-app .req-status-off {
  background: rgba(113, 113, 122, 0.25);
  color: #a1a1aa;
}

.tr-app .req-status-cell {
  white-space: nowrap;
  text-align: center;
}

.tr-app .req-status-group {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  max-width: 100%;
}

.tr-app .req-az-wrap {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.tr-app .req-az-setup-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1.2;
  color: #93c5fd;
  background: rgba(99, 102, 241, 0.1);
  border: 1px solid rgba(129, 140, 248, 0.28);
  box-shadow: none;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.tr-app .req-az-setup-btn:hover {
  color: #e9d5ff;
  background: rgba(99, 102, 241, 0.18);
  border-color: rgba(167, 139, 250, 0.45);
}

.tr-app .az-cfg {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.tr-app .az-cfg-guide {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(99, 102, 241, 0.16), rgba(59, 130, 246, 0.07));
  border: 1px solid rgba(129, 140, 248, 0.28);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.tr-app .az-cfg-guide-head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.tr-app .az-cfg-guide-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #c7d2fe;
  background: rgba(99, 102, 241, 0.24);
  border: 1px solid rgba(129, 140, 248, 0.32);
}

.tr-app .az-cfg-guide-head-text {
  min-width: 0;
}

.tr-app .az-cfg-guide-title {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--tr-text, var(--text));
  line-height: 1.3;
}

.tr-app .az-cfg-guide-lead {
  margin: 4px 0 0;
  font-size: 0.78rem;
  color: var(--tr-muted, var(--muted));
  line-height: 1.45;
}

.tr-app .az-cfg-guide-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: az-guide-step;
  display: grid;
  gap: 10px;
}

.tr-app .az-cfg-guide-steps li {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 10px;
  align-items: start;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--tr-text, var(--text));
}

.tr-app .az-cfg-guide-steps li::before {
  counter-increment: az-guide-step;
  content: counter(az-guide-step);
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.7rem;
  font-weight: 700;
  color: #a5b4fc;
  background: rgba(99, 102, 241, 0.18);
  border: 1px solid rgba(129, 140, 248, 0.35);
}

.tr-app .az-cfg-guide-foot {
  margin: 0;
  padding-top: 10px;
  border-top: 1px solid rgba(129, 140, 248, 0.16);
  font-size: 0.75rem;
  color: var(--tr-muted, var(--muted));
  line-height: 1.45;
}

.tr-app .az-cfg-hint {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--tr-muted);
  line-height: 1.45;
}

.tr-app .az-cfg-bank {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--tr-muted);
}

.tr-app .az-cfg-copy-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}

.tr-app .az-cfg-copy-row input,
.tr-app .az-cfg-copy-row textarea {
  flex: 1;
  min-width: 0;
}

.tr-app .az-cfg-body {
  resize: none;
  font-size: 0.8rem;
  line-height: 1.5;
}

.tr-app .az-cfg-test {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(16, 185, 129, 0.14), rgba(99, 102, 241, 0.06));
  border: 1px solid rgba(52, 211, 153, 0.28);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.tr-app .az-cfg-test-head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.tr-app .az-cfg-test-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #6ee7b7;
  background: rgba(16, 185, 129, 0.2);
  border: 1px solid rgba(52, 211, 153, 0.35);
}

.tr-app .az-cfg-test-head-text {
  min-width: 0;
}

.tr-app .az-cfg-test-title {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--tr-text, var(--text));
  line-height: 1.3;
}

.tr-app .az-cfg-test-hint {
  margin: 4px 0 0;
  font-size: 0.78rem;
  color: var(--tr-muted, var(--muted));
  line-height: 1.45;
}

.tr-app .az-test-order-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 40px;
  padding: 10px 16px;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.2;
  border-radius: 10px;
  white-space: nowrap;
  color: #ecfdf5;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.72), rgba(5, 150, 105, 0.58));
  border: 1px solid rgba(52, 211, 153, 0.5);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, transform 0.1s, box-shadow 0.15s;
}

.tr-app .az-test-order-btn:hover:not(:disabled) {
  color: #fff;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.88), rgba(5, 150, 105, 0.72));
  border-color: rgba(110, 231, 183, 0.65);
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.tr-app .az-test-order-btn:active:not(:disabled) {
  transform: translateY(1px);
}

.tr-app .az-test-order-btn:disabled {
  opacity: 0.65;
  cursor: wait;
}

.tr-app .az-test-order-btn-icon {
  flex-shrink: 0;
  opacity: 0.92;
}

.tr-app .az-test-result {
  font-size: 0.82rem;
  line-height: 1.5;
  margin: 0;
}

.tr-app .payout-close-details {
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid var(--tr-line);
  border-radius: 10px;
  background: var(--tr-surface-2);
  display: grid;
  gap: 10px;
}

.tr-app .payout-close-details-row .mono,
.tr-app .payout-close-cred,
.tr-app .payout-close-recipient {
  margin-top: 4px;
  font-size: 0.9375rem;
  letter-spacing: 0.02em;
}

.tr-app .payout-close-recipient {
  line-height: 1.35;
  min-width: 0;
}

.tr-app .payout-close-details-row .payout-copy-text {
  display: inline-block;
  margin-top: 4px;
  max-width: 100%;
}

.tr-app .payout-close-copy-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
  min-width: 0;
}

.tr-app .payout-close-copy-row .payout-close-copy-value {
  flex: 1;
  min-width: 0;
}

.tr-app .payout-copy-wrap.payout-close-copy-row {
  position: relative;
  width: 100%;
}

.tr-app .payout-close-copy-row .payout-copy-icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  min-width: 28px;
  color: var(--tr-muted);
}

.tr-app .payout-close-copy-row .payout-copy-icon:hover:not(:disabled) {
  color: var(--tr-text);
  border-color: rgba(59, 130, 246, 0.45);
}

.tr-app .payout-close-copy-row .payout-copy-icon svg {
  display: block;
}

.tr-app .payout-copy-badge {
  position: absolute;
  right: 0;
  bottom: calc(100% + 6px);
  padding: 4px 9px;
  border-radius: 6px;
  background: rgba(22, 163, 74, 0.96);
  border: 1px solid rgba(74, 222, 128, 0.45);
  color: #ecfdf5;
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  pointer-events: none;
  box-shadow: 0 6px 16px rgba(22, 163, 74, 0.28);
  z-index: 5;
  animation: payout-copy-badge-in 0.16s ease;
}

@keyframes payout-copy-badge-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.tr-app .payout-copy-text {
  display: inline;
  margin: 0;
  padding: 1px 3px;
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
  border-radius: 4px;
  vertical-align: baseline;
  max-width: 100%;
}

.tr-app .payout-copy-text:hover {
  background: rgba(59, 130, 246, 0.1);
}

.tr-app .payout-copy-text:focus-visible {
  outline: 2px solid rgba(59, 130, 246, 0.45);
  outline-offset: 1px;
}

.tr-app .payout-copy-text.is-copied {
  background: rgba(22, 163, 74, 0.22);
  box-shadow: 0 0 0 1px rgba(74, 222, 128, 0.35);
}

#tr-toast.op-toast {
  z-index: 1000;
}

.tr-app .form-row.payout-close-amount-row .payout-close-copy-value strong,
.tr-app .form-row .payout-copy-text strong {
  font-size: 1.125rem;
}

.tr-app .az-test-modal {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.tr-app .az-test-modal-lead {
  margin: 0;
  line-height: 1.55;
  font-size: 0.92rem;
}

.tr-app .az-test-modal-amount {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba(99, 102, 241, 0.12);
  border: 1px solid rgba(99, 102, 241, 0.25);
}

.tr-app .az-test-modal-amount-value {
  font-size: 1.35rem;
  letter-spacing: 0.02em;
}

.tr-app .az-test-modal-card .mono {
  margin: 6px 0 10px;
  font-size: 1rem;
}

.tr-app .az-test-modal-holder-label {
  display: block;
  margin-top: 12px;
}

.tr-app .az-test-modal-steps {
  margin: 0;
  padding-left: 1.2rem;
  line-height: 1.55;
  font-size: 0.88rem;
}

.tr-app .az-test-modal-steps li + li {
  margin-top: 8px;
}

.tr-app .az-test-modal-note {
  margin: 0;
  font-size: 0.82rem;
}

.tr-app .status.az-test {
  padding: 2px 8px;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.35;
  background: rgba(99, 102, 241, 0.12);
  color: #a5b4fc;
  border: 1px solid rgba(129, 140, 248, 0.22);
}

.tr-app .status.az-test-done {
  background: rgba(34, 197, 94, 0.1);
  color: #86efac;
  border-color: rgba(74, 222, 128, 0.22);
}

.tr-app .az-cfg-qr {
  display: flex;
  justify-content: center;
  padding: 4px 0;
  border-radius: 12px;
  background: transparent;
  border: none;
}

.tr-app .az-qr-img {
  display: block;
  border-radius: 8px;
}


.tr-app .req-az {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px 2px 6px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #e4e4e7;
}

.tr-app .req-az-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.tr-app .req-az--online {
  background: rgba(34, 197, 94, 0.12);
  color: #bbf7d0;
}

.tr-app .req-az--online .req-az-dot {
  background: #2ee6a0;
  box-shadow: 0 0 6px #2ee6a0, 0 0 12px rgba(34, 197, 94, 0.65);
  animation: req-az-pulse-green 2s ease-in-out infinite;
}

.tr-app .req-az--offline {
  background: rgba(239, 68, 68, 0.12);
  color: #fecaca;
}

.tr-app .req-az--offline .req-az-dot {
  background: #ef4444;
  box-shadow: 0 0 6px #ef4444, 0 0 12px rgba(239, 68, 68, 0.65);
  animation: req-az-pulse-red 2s ease-in-out infinite;
}

@keyframes req-az-pulse-green {
  0%, 100% { box-shadow: 0 0 6px #2ee6a0, 0 0 12px rgba(34, 197, 94, 0.55); }
  50% { box-shadow: 0 0 10px #4ade80, 0 0 18px rgba(74, 222, 128, 0.85); }
}

@keyframes req-az-pulse-red {
  0%, 100% { box-shadow: 0 0 6px #ef4444, 0 0 12px rgba(239, 68, 68, 0.55); }
  50% { box-shadow: 0 0 10px #f87171, 0 0 18px rgba(248, 113, 113, 0.85); }
}

/* Settings page */
.tr-app .tr-settings-page {
  flex: 1;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.tr-app .tr-settings-hero {
  padding: 4px 2px 8px;
}

.tr-app .tr-settings-title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #f8fafc;
}

.tr-app .tr-settings-subtitle {
  margin: 6px 0 0;
  font-size: 0.875rem;
  color: var(--tr-muted);
  max-width: 640px;
  line-height: 1.45;
}

.tr-app .tr-settings-cards {
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
  min-height: 0;
}

.tr-app .tr-settings-card {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 18px 20px;
  padding: 22px 24px;
  border-radius: 16px;
  border: 1px solid var(--tr-line);
  background: linear-gradient(145deg, rgba(24, 24, 34, 0.98), rgba(14, 14, 20, 0.98));
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.tr-app .tr-settings-card:hover {
  border-color: #35354a;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
}

.tr-app .tr-settings-card--pass { --tr-set-accent: rgba(59, 130, 246, 0.22); --tr-set-accent-border: rgba(59, 130, 246, 0.45); }
.tr-app .tr-settings-card--telegram { --tr-set-accent: rgba(56, 189, 248, 0.18); --tr-set-accent-border: rgba(56, 189, 248, 0.4); }
.tr-app .tr-settings-card--2fa.is-on {
  --tr-set-accent: rgba(34, 197, 94, 0.28);
  --tr-set-accent-border: rgba(74, 222, 128, 0.75);
}
.tr-app .tr-settings-card--2fa.is-off {
  --tr-set-accent: rgba(251, 191, 36, 0.28);
  --tr-set-accent-border: rgba(252, 211, 77, 0.75);
}
.tr-app .tr-settings-card--2fa.is-on .tr-settings-card-icon {
  background: linear-gradient(145deg, #2ee6a0, #15803d);
  border-color: rgba(134, 239, 172, 0.85);
  box-shadow: 0 4px 14px rgba(34, 197, 94, 0.35);
}
.tr-app .tr-settings-card--2fa.is-off .tr-settings-card-icon {
  background: linear-gradient(145deg, #fb923c, #ea580c);
  border-color: rgba(253, 186, 116, 0.85);
  box-shadow: 0 4px 14px rgba(249, 115, 22, 0.35);
}

.tr-app .tr-settings-card-icon {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  font-size: 1.35rem;
  background: var(--tr-set-accent, var(--tr-purple-soft));
  border: 1px solid var(--tr-set-accent-border, rgba(59, 130, 246, 0.35));
}

.tr-app .tr-settings-card-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.tr-app .tr-settings-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.tr-app .tr-settings-card-head h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: #f8fafc;
}

.tr-app .tr-settings-card-head p {
  margin: 4px 0 0;
  font-size: 0.8125rem;
  color: var(--tr-muted);
  line-height: 1.45;
  max-width: 520px;
}

.tr-app .tr-settings-btn {
  flex-shrink: 0;
  min-height: 36px;
  padding: 0 16px;
  border-radius: 10px;
  border: 1px solid rgba(59, 130, 246, 0.55);
  background: linear-gradient(180deg, #2563eb, #1e40af);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
}

.tr-app .tr-settings-btn:hover:not(:disabled) {
  box-shadow: 0 6px 20px rgba(91, 33, 182, 0.35);
  transform: translateY(-1px);
}

.tr-app .tr-settings-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.tr-app .tr-settings-btn--ghost {
  background: transparent;
  border-color: var(--tr-line);
  color: var(--tr-text);
  box-shadow: none;
}

.tr-app .tr-settings-btn--ghost:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.04);
  box-shadow: none;
  transform: none;
}

.tr-app .tr-settings-btn--danger {
  background: linear-gradient(180deg, #dc2626, #b91c1c);
  border-color: rgba(239, 68, 68, 0.55);
}

.tr-app .tr-settings-btn--danger:hover:not(:disabled) {
  box-shadow: 0 6px 20px rgba(220, 38, 38, 0.28);
}

.tr-app .tr-settings-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.tr-app .tr-settings-field label {
  font-size: 0.75rem;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: 0.02em;
}

.tr-app .tr-settings-field input {
  width: 100%;
  min-height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid var(--tr-line);
  background: #0a0a10;
  color: var(--tr-text);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.tr-app .tr-settings-field input:focus {
  outline: none;
  border-color: rgba(59, 130, 246, 0.65);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.18);
}

.tr-app .tr-settings-pass-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 16px;
}

.tr-app .tr-settings-field--telegram {
  max-width: 380px;
}

.tr-app .tr-settings-telegram-input {
  display: flex;
  align-items: center;
  min-height: 40px;
  border-radius: 10px;
  border: 1px solid var(--tr-line);
  background: #0a0a10;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.tr-app .tr-settings-telegram-input:focus-within {
  border-color: rgba(56, 189, 248, 0.65);
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.15);
}

.tr-app .tr-settings-telegram-input .tr-settings-at {
  padding: 0 0 0 12px;
  color: #38bdf8;
  font-weight: 700;
  font-size: 0.9375rem;
}

.tr-app .tr-settings-telegram-input input {
  border: none;
  background: transparent;
  box-shadow: none;
  min-height: 38px;
  padding-left: 4px;
}

.tr-app .tr-settings-telegram-input input:focus {
  box-shadow: none;
}

.tr-app .tr-settings-2fa-body {
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px dashed rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.22);
}

.tr-app .tr-settings-2fa-hint {
  margin: 0 0 12px;
  font-size: 0.8125rem;
  color: var(--tr-muted);
}

.tr-app .tr-settings-2fa-disable {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
}

.tr-app .tr-settings-field--code {
  max-width: 200px;
}

.tr-app .tr-settings-field--code input {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.15em;
  text-align: center;
  font-size: 1rem;
}

.tr-app .tr-settings-totp-wizard {
  gap: 14px;
}

.tr-app .tr-settings-totp-step {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.8125rem;
  color: #cbd5e1;
}

.tr-app .tr-settings-step-num {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 800;
  background: var(--tr-purple-soft);
  border: 1px solid rgba(59, 130, 246, 0.45);
  color: #ddd6fe;
  flex-shrink: 0;
}

.tr-app .tr-settings-totp-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.tr-app .tr-settings-totp-switch {
  flex-shrink: 0;
}

.tr-app .tr-page--settings {
  flex: 1;
  min-height: 0;
}

.tr-app .tr-totp-setup {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.tr-app .tr-totp-secret {
  padding: 10px 12px;
  background: #0a0a10;
  border: 1px solid var(--tr-line);
  border-radius: 8px;
  word-break: break-all;
  font-size: 13px;
}

.tr-app .tr-totp-qr {
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  align-self: flex-start;
}

.tr-app .search-input {
  min-width: 220px;
  background: #0a0a10;
  border-color: var(--tr-line);
  border-radius: 10px;
}

.tr-app .panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--tr-line);
  background: #0e0e14;
}

.tr-app .panel-body { padding: 16px 18px; }

.tr-app .form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
}

.tr-app .form-row input,
.tr-app .form-row select,
.tr-app .form-row textarea {
  background: #0a0a10;
  border-color: var(--tr-line);
  border-radius: 10px;
  color: var(--tr-text);
}

.tr-app .output {
  background: #0a0a10;
  border: 1px solid var(--tr-line);
  border-radius: 10px;
  padding: 12px;
  font-size: 0.8125rem;
  max-height: 320px;
  overflow: auto;
}

.tr-app .notice {
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(59, 130, 246, 0.1);
  border: 1px solid rgba(59, 130, 246, 0.25);
  color: #93c5fd;
  font-size: 0.8125rem;
}

.tr-app .donut-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px;
}

.tr-app .legend { flex: 1; min-width: 200px; display: grid; gap: 8px; }

.tr-app .legend-item {
  display: grid;
  grid-template-columns: 10px 1fr auto auto;
  gap: 8px;
  align-items: center;
  font-size: 0.8125rem;
}

.tr-app .legend-dot { width: 10px; height: 10px; border-radius: 999px; }
.tr-app .legend-label { color: #94a3b8; }
.tr-app .legend-value { font-weight: 700; color: #f8fafc; }
.tr-app .legend-pct { color: #64748b; font-size: 0.75rem; }

.tr-app .donut-value { fill: #f8fafc; font-size: 1.75rem; font-weight: 800; }
.tr-app .donut-label { fill: #64748b; font-size: 0.8125rem; }

.tr-app .kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.tr-app .kpis-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 1200px) {
  .tr-app .headline-row { grid-template-columns: 1fr; }
  .tr-app .grid.two { grid-template-columns: 1fr; }
  .tr-app .metric-grid.three { grid-template-columns: 1fr 1fr; }
  .tr-app .kpis { grid-template-columns: repeat(2, 1fr); }
  .tr-app .tr-settings-pass-grid { grid-template-columns: 1fr; }
  .tr-app .tr-settings-card { grid-template-columns: 1fr; }
  .tr-app .tr-settings-card-icon { width: 44px; height: 44px; font-size: 1.125rem; }
  .tr-app .tr-settings-card-head { flex-direction: column; align-items: stretch; }
  .tr-app .tr-settings-btn { width: 100%; }
}

@media (max-width: 900px) {
  .tr-app .form-grid { grid-template-columns: 1fr; }
  .tr-app .metric-grid { grid-template-columns: 1fr; }
  .tr-app .op-notifications-layout { grid-template-columns: 1fr; }
}

.tr-app .op-notifications-layout {
  display: grid;
  grid-template-columns: minmax(280px, 400px) 1fr;
  gap: 16px;
  align-items: start;
  flex: 1;
  min-height: 0;
}

.tr-app .tr-page--crypto,
.tr-app .crypto-page {
  overflow: auto;
  gap: 16px;
}

.tr-app .tr-page--notifications {
  overflow: auto;
}

.tr-app .order-row-actions {
  min-width: 0;
  justify-content: flex-end;
}

.tr-app .icon-btn {
  width: 32px;
  height: 32px;
  min-width: 32px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  line-height: 1;
  border-radius: 8px;
  border: 1px solid var(--tr-line);
  background: rgba(255, 255, 255, 0.04);
  color: var(--tr-text);
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.tr-app .icon-btn:hover:not(:disabled) {
  border-color: #475569;
  background: rgba(255, 255, 255, 0.08);
}

.tr-app .icon-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.tr-app .icon-btn--view {
  border-color: rgba(56, 189, 248, 0.35);
  color: #7dd3fc;
}

.tr-app .icon-btn--view:hover:not(:disabled) {
  border-color: rgba(56, 189, 248, 0.6);
  color: #bae6fd;
}

.tr-app .icon-btn--callback {
  border-color: rgba(59, 130, 246, 0.4);
  color: #93c5fd;
}

.tr-app .icon-btn--callback:hover:not(:disabled) {
  border-color: rgba(59, 130, 246, 0.65);
  color: #ddd6fe;
}

.tr-app .icon-btn--retry {
  border-color: rgba(249, 115, 22, 0.4);
  color: #fdba74;
  margin-top: 8px;
}

.tr-app .icon-btn--retry:hover:not(:disabled) {
  border-color: rgba(249, 115, 22, 0.65);
  color: #fed7aa;
}

.tr-app .icon-btn--apply {
  align-self: flex-end;
  min-width: 40px;
  width: 40px;
  height: 40px;
  font-size: 1.125rem;
  font-weight: 700;
  border-color: rgba(34, 197, 94, 0.5);
  background: linear-gradient(180deg, rgba(34, 197, 94, 0.22), rgba(22, 163, 74, 0.18));
  color: #4ade80;
}

.tr-app .icon-btn--apply:hover:not(:disabled) {
  border-color: rgba(34, 197, 94, 0.75);
  color: #86efac;
}

.tr-app .order-status-apply-row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  margin-top: 12px;
}

.tr-app .order-status-select {
  flex: 1;
  min-width: 0;
}

.tr-app .drawer-actions--icons {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tr-app .az-log-push-cell {
  max-width: 280px;
  min-width: 160px;
  vertical-align: top;
}

.tr-app .az-log-push-text {
  font-size: 0.8125rem;
  line-height: 1.45;
  word-break: break-word;
  white-space: pre-wrap;
}

/* ============================================================
   Aurora (safe) — аккуратный полиш. БЕЗ градиентного текста,
   БЕЗ overflow:hidden, БЕЗ backdrop-filter, БЕЗ фонового неона.
   Откат: удалить блок от этого маркера до конца файла.
   ============================================================ */
/* типографика: заголовки и крупные числа — Space Grotesk (сплошной цвет) */
.tr-app .tr-brand-name,
.tr-app .tr-topbar-head h1,
.tr-app .tr-dash-chart-head h3,
.tr-app .tr-dash-table-head h3,
.tr-app .tr-dash-metric-value,
.tr-app .tr-dash-mini-value,
.tr-app .tr-balance-chip strong { font-family: var(--font-brand); letter-spacing: -0.012em; }
.tr-app .tr-dash-metric-value { letter-spacing: -0.025em; }

/* сайдбар / топбар: лёгкая глубина (сплошные градиенты, без блюра) */
.tr-app .tr-sidebar {
  background: linear-gradient(180deg, #0e1220, #0a0d18) !important;
  border-right: 1px solid rgba(255,255,255,0.06) !important;
}
.tr-app .tr-topbar {
  background: linear-gradient(180deg, #0d1019, rgba(11,14,22,0.92)) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

/* активный пункт меню: мягкая aurora-подсветка (сдержанно) */
.tr-app .tr-side-link.active {
  background: linear-gradient(100deg, rgba(91, 157, 246,0.16), rgba(99,102,241,0.06)) !important;
  box-shadow: inset 0 0 0 1px rgba(91, 157, 246,0.30), 0 6px 18px -12px rgba(91, 157, 246,0.55) !important;
}
.tr-app .tr-side-link.active .tr-side-icon { color: var(--tr-purple) !important; }

/* карточки: глубина + тонкая верхняя подсветка (нейтрально, не неон) */
.tr-app .tr-dash-metric,
.tr-app .tr-dash-chart-card,
.tr-app .tr-dash-table-card,
.tr-app .tr-dash-mini {
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 16px !important;
  box-shadow: 0 18px 44px -26px rgba(0,0,0,0.82), inset 0 1px 0 rgba(255,255,255,0.05) !important;
}

/* чипы топбара: аккуратные поверхности; баланс — мятным */
.tr-app .tr-balance-chip,
.tr-app .tr-rate-chip,
.tr-app .tr-traffic-chip {
  border: 1px solid rgba(255,255,255,0.07) !important;
}
.tr-app .tr-balance-chip strong { color: var(--tr-mint, #2ee6a0) !important; }

/* иконки метрик — мягкая фиолетовая плашка */
.tr-app .tr-dash-metric-icon {
  background: rgba(91, 157, 246,0.16) !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
}

/* таблицы: ховер строки, аккуратный заголовок */
.tr-app tbody tr:hover td { background: rgba(91, 157, 246,0.06) !important; }
/* /Aurora safe */

/* ===== Aurora премиум: плашки и графики ===== */
.tr-app .tr-dash-bar {
  background: linear-gradient(180deg, #a855f7, #2563eb);
  border-radius: 7px 7px 3px 3px;
  box-shadow: 0 6px 14px -6px rgba(91, 157, 246, 0.55);
  transition: filter .15s ease;
}
.tr-app .tr-dash-bar-col:hover .tr-dash-bar { filter: brightness(1.12); }
.tr-app .tr-dash-line-chart { filter: drop-shadow(0 6px 14px rgba(91, 157, 246, 0.28)); overflow: visible; }
.tr-app .tr-dash-metric,
.tr-app .tr-dash-chart-card,
.tr-app .tr-dash-table-card,
.tr-app .tr-dash-mini {
  box-shadow: 0 22px 50px -28px rgba(0, 0, 0, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  transition: transform .2s ease, box-shadow .2s ease;
}
.tr-app .tr-dash-metric:hover,
.tr-app .tr-dash-chart-card:hover { transform: translateY(-2px); }
.tr-app .donut-value { font-family: var(--font-brand); }
/* /Aurora премиум */

/* ===== Сегментированные переключатели OFF | ON (как в макете) ===== */
.tr-app .req-switch,
.tr-app button.req-switch,
.tr-app .tr-traffic-switch {
  position: relative;
  width: 68px !important;
  min-width: 68px;
  height: 28px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--tr-line) !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.28);
  overflow: hidden;
  cursor: pointer;
}
.tr-app .req-switch::before,
.tr-app .req-switch::after {
  position: absolute;
  top: 0;
  height: 100%;
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.06em;
  z-index: 2;
  pointer-events: none;
  transition: color .2s ease;
}
.tr-app .req-switch::before { content: "OFF"; left: 0; color: var(--tr-muted); }
.tr-app .req-switch::after { content: "ON"; right: 0; color: var(--tr-muted); }
.tr-app .req-switch .req-switch-slider {
  position: absolute;
  top: 3px;
  left: 3px;
  width: calc(50% - 3px);
  height: calc(100% - 6px);
  border-radius: 999px;
  background: #f8fafc !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
  transition: transform .22s cubic-bezier(.4, 0, .2, 1), background .2s ease;
  z-index: 1;
}
.tr-app .req-switch .req-switch-slider::before { display: none !important; }
/* OFF активна по умолчанию */
.tr-app .req-switch[aria-checked="false"]::before,
.tr-app .req-switch:not(.is-on):not([aria-checked="true"])::before { color: #0f172a; }
/* ON активна */
.tr-app .req-switch.is-on .req-switch-slider,
.tr-app .req-switch[aria-checked="true"] .req-switch-slider {
  transform: translateX(100%);
  background: #2ee6a0 !important;
}
.tr-app .req-switch.is-on::after,
.tr-app .req-switch[aria-checked="true"]::after { color: #06281c; }
.tr-app .req-switch.is-on::before,
.tr-app .req-switch[aria-checked="true"]::before { color: var(--tr-muted); }
/* /сегментированные переключатели */

/* ===== Концепт B — Data Card (плашки метрик) ===== */
.tr-app .tr-dash-metric--data {
  position: relative;
  overflow: hidden;
  padding: 16px 16px 0 !important;
  display: flex;
  flex-direction: column;
}
.tr-app .tr-dash-metric--data .tr-dash-metric-top { display: flex; align-items: flex-start; gap: 11px; }
.tr-app .tr-dash-metric--data .tr-dash-metric-icon {
  width: 36px; height: 36px; flex: none; border: 0;
  border-radius: 11px; display: grid; place-items: center; color: #fff;
}
.tr-app .tr-dash-metric--data .tr-dash-metric-icon svg { width: 18px; height: 18px; }
.tr-app .tr-dash-metric--data.green .tr-dash-metric-icon  { background: linear-gradient(150deg, #2ee6a0, #22d3ee); box-shadow: 0 8px 18px -8px #2ee6a0; }
.tr-app .tr-dash-metric--data.orange .tr-dash-metric-icon { background: linear-gradient(150deg, #ffb24d, #ff7a86); box-shadow: 0 8px 18px -8px #ffb24d; }
.tr-app .tr-dash-metric--data.purple .tr-dash-metric-icon { background: linear-gradient(150deg, #a855f7, #6366f1); box-shadow: 0 8px 18px -8px #a855f7; }
.tr-app .tr-dash-metric--data.blue .tr-dash-metric-icon   { background: linear-gradient(150deg, #22d3ee, #5b9dff); box-shadow: 0 8px 18px -8px #22d3ee; }
.tr-app .tr-dash-metric--data .tr-dash-metric-info { min-width: 0; flex: 1; }
.tr-app .tr-dash-metric--data .tr-dash-metric-title { color: var(--tr-muted); font-size: 0.78rem; margin-bottom: 2px; }
.tr-app .tr-dash-metric--data .tr-dash-metric-value { font-size: 1.45rem; line-height: 1.12; margin: 0; }
.tr-app .tr-dash-metric--data .tr-dash-metric-badge {
  margin-left: auto; flex: none; white-space: nowrap;
  font-size: 0.7rem; font-weight: 700; color: #06281c;
  background: #2ee6a0; padding: 3px 8px; border-radius: 7px;
}
.tr-app .tr-dash-metric--data .tr-dash-metric-badge .tr-dash-trend { color: inherit; background: none; padding: 0; }
.tr-app .tr-dash-metric--data .tr-dash-metric-sub { color: var(--tr-muted); font-size: 0.75rem; margin: 8px 0 10px; }
.tr-app .tr-dash-metric--data .tr-dash-metric-chart { display: block; width: calc(100% + 32px); height: 46px; margin: auto -16px 0; }
/* /Data Card */

/* ===== Вариант 10 — Minimal (весь дашборд) ===== */
.tr-app .tr-dash-metric,
.tr-app .tr-dash-chart-card,
.tr-app .tr-dash-table-card,
.tr-app .tr-dash-mini {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  box-shadow: none !important;
  border-radius: 14px !important;
}
.tr-app .tr-dash-metric::before, .tr-app .tr-dash-metric::after,
.tr-app .tr-dash-chart-card::before, .tr-app .tr-dash-chart-card::after,
.tr-app .tr-dash-table-card::before, .tr-app .tr-dash-table-card::after,
.tr-app .tr-dash-mini::before, .tr-app .tr-dash-mini::after { display: none !important; }
.tr-app .tr-dash-metric:hover, .tr-app .tr-dash-chart-card:hover { transform: none !important; }
/* KPI минимал — скрыть нижний мини-график (как в варианте 10) */
.tr-app .tr-dash-metric--data .tr-dash-metric-chart { display: none !important; }
.tr-app .tr-dash-metric--data { padding: 16px 16px 14px !important; }
.tr-app .tr-dash-metric-badge { background: transparent !important; color: #2ee6a0 !important; padding: 0 !important; }
/* больше воздуха */
.tr-app .tr-dash-metrics, .tr-app .tr-dash-charts, .tr-app .tr-dash-mini-grid, .tr-app .tr-dash-tables { gap: 16px !important; }
/* бары обсягу — спокойнее под минимал */
.tr-app .tr-dash-bar { background: linear-gradient(180deg, #5b9dff, #2563eb) !important; box-shadow: none !important; opacity: .9; }
/* /Minimal */

/* ===== Minimal: сайдбар + топбар ===== */
.tr-app .tr-sidebar {
  background: transparent !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
  box-shadow: none !important;
}
.tr-app .tr-topbar {
  background: transparent !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
.tr-app .tr-side-link.active {
  background: rgba(91, 157, 246, 0.14) !important;
  box-shadow: inset 0 0 0 1px rgba(91, 157, 246, 0.30) !important;
  color: #fff !important;
}
.tr-app .tr-side-link.active .tr-side-icon { color: var(--tr-purple) !important; }
.tr-app .tr-profile { background: transparent !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; }
.tr-app .tr-logout-btn { background: transparent !important; border: 1px solid rgba(255, 255, 255, 0.08) !important; box-shadow: none !important; }
.tr-app .tr-balance-chip, .tr-app .tr-rate-chip, .tr-app .tr-traffic-chip { background: rgba(255, 255, 255, 0.03) !important; box-shadow: none !important; }
/* /Minimal sidebar */

/* ===== Minimal: весь кабинет (контент-панели/карты всех разделов) ===== */
.tr-app .payin-kpi,
.tr-app .payin-panel,
.tr-app .payin-table-wrap,
.tr-app .panel,
.tr-app .table-panel,
.tr-app .tr-settings-card,
.tr-app .headline-card,
.tr-app .tr-restricted-card,
.tr-app .orders-panel,
.tr-app .merchants-panel,
.tr-app .kpi {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  box-shadow: none !important;
}
.tr-app .payin-panel-title,
.tr-app .panel-header,
.tr-app .orders-panel-head,
.tr-app .merchants-panel-head { background: transparent !important; border-color: rgba(255, 255, 255, 0.07) !important; }
.tr-app .payin-search,
.tr-app .payin-view-toggle,
.tr-app .payin-toolbar { background: rgba(255, 255, 255, 0.03) !important; box-shadow: none !important; }
/* активные табы/кнопки-вид — спокойный фиолет вместо градиента */
.tr-app .payin-filter-tab.active,
.tr-app .payin-view-btn.active {
  background: rgba(91, 157, 246, 0.16) !important;
  box-shadow: inset 0 0 0 1px rgba(91, 157, 246, 0.30) !important;
  color: #fff !important;
}
/* числа KPI — в Onest для единства */
.tr-app .payin-kpi-value, .tr-app .kpi strong { font-family: var(--font-brand); }
/* /Minimal cabinet */

/* ===== PayIn — Compact Terminal (вариант 5) ===== */
.tr-app .payin-orders-table { font-family: var(--font-mono); width: 100%; }
.tr-app .payin-orders-table th { padding: 7px 10px !important; font-size: 9.5px !important; letter-spacing: 0.05em; }
.tr-app .payin-orders-table td { padding: 6px 10px !important; font-size: 11.5px !important; vertical-align: middle; }
.tr-app .payin-req-id,
.tr-app .payin-req-id.mono { font-family: var(--font-mono) !important; font-size: 11.5px !important; }
.tr-app .payin-amount { font-family: var(--font-mono) !important; font-size: 12px !important; }
.tr-app .payin-sub-amount,
.tr-app .payin-req-pair,
.tr-app .payin-beneficiary,
.tr-app .payin-expiry { font-size: 10px !important; }
.tr-app .payin-orders-table .status { font-size: 10px !important; padding: 2px 7px !important; }
.tr-app .payin-table-wrap { border-radius: 12px; }
/* плотнее KPI-полоса под терминал */
.tr-app .payin-kpi { padding: 9px 12px !important; }
.tr-app .payin-kpi-value { font-size: 1.2rem !important; }
.tr-app .payin-kpi-label { font-size: 0.72rem !important; }
/* кнопки в строке — компактнее */
.tr-app .payin-details-btn, .tr-app .payin-menu-btn { font-size: 10.5px !important; min-height: 1.5rem !important; }
/* /Terminal PayIn */

/* ===== Минимал-статусы: цветная точка со свечением + текст ===== */
.tr-app .status {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  font-weight: 600;
  letter-spacing: 0;
  white-space: nowrap;
}
.tr-app .status::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 7px currentColor, 0 0 2px currentColor;
  flex: none;
}
/* в терминал-таблице точка чуть меньше */
.tr-app .payin-orders-table .status { padding: 0 !important; }
.tr-app .payin-orders-table .status::before { width: 6px; height: 6px; }
/* /Минимал-статусы */

/* статусы — ровно по левому краю столбца (а не по центру) */
.tr-app table td:has(.status),
.tr-app .payin-orders-table td:has(.status) { text-align: left !important; }
.tr-app .payin-orders-table th:nth-child(3) { text-align: left !important; }
.tr-app .status { justify-content: flex-start; }
/* /статусы влево */

/* таблицы — прозрачные строки (фон #050508 просвечивает) */
.tr-app table tbody tr,
.tr-app .payin-orders-table tbody tr { background: transparent !important; }
.tr-app table th,
.tr-app .payin-orders-table th { background: rgba(5, 5, 8, 0.94) !important; }
/* /прозрачные таблицы */

/* системный ID — обрезка длинного UUID (полный в title/hover) */
.tr-app .payin-req-id { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* /системный ID */

/* системный ID — короткий + клик-копирование */
.tr-app .payin-req-id.op-copy-id { cursor: pointer; max-width: none; overflow: visible; white-space: nowrap; transition: color .15s ease; }
.tr-app .payin-req-id.op-copy-id::after { content: "⧉"; margin-left: 6px; opacity: 0; font-size: 0.85em; transition: opacity .15s ease; }
.tr-app .payin-req-id.op-copy-id:hover { color: var(--tr-purple); }
.tr-app .payin-req-id.op-copy-id:hover::after { opacity: .7; }
/* читаемость терминал-таблицы — крупнее и просторнее */
.tr-app .payin-orders-table td { font-size: 12px !important; padding: 8px 11px !important; }
.tr-app .payin-orders-table th { font-size: 10px !important; padding: 8px 11px !important; }
.tr-app .payin-req-id { font-size: 12px !important; }
.tr-app .payin-sub-amount, .tr-app .payin-req-pair, .tr-app .payin-beneficiary, .tr-app .payin-expiry { font-size: 10.5px !important; }
/* /ID copy + читаемость */

/* полный ID + выровненная таблица (отмена обрезки) */
.tr-app .payin-req-id { max-width: none !important; overflow: visible !important; text-overflow: clip !important; white-space: nowrap !important; }
.tr-app .payin-table-wrap { overflow-x: auto; }
.tr-app .payin-orders-table { table-layout: auto; width: 100%; }
.tr-app .payin-orders-table th,
.tr-app .payin-orders-table td { text-align: left !important; vertical-align: middle; white-space: nowrap; }
.tr-app .payin-orders-table .payin-req-id { padding-right: 14px; }
/* /полный ID + выравнивание */

/* все столбцы — по содержимому, ничего не обрезается */
.tr-app .payin-orders-table { table-layout: auto !important; width: 100%; }
.tr-app .payin-orders-table col { width: auto !important; }
.tr-app .payin-orders-table th,
.tr-app .payin-orders-table td {
  overflow: visible !important;
  width: auto !important;
  max-width: none !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
}
.tr-app .payin-table-wrap { overflow-x: auto; }
/* /столбцы по содержимому */

/* убрать пустоту у ID (иконка копирования не резервирует место) */
.tr-app .payin-req-id.op-copy-id::after { content: none !important; }
.tr-app .payin-orders-table .payin-req-id { padding-right: 0 !important; }
.tr-app .payin-req-id.op-copy-id { display: inline-block; }
.tr-app .payin-req-id.op-copy-id:hover { text-decoration: underline; text-underline-offset: 2px; }
/* /убрать пустоту ID */

/* ID — интерактивная зона строго по тексту (не на всю ячейку) */
.tr-app .payin-req-id.op-copy-id {
  display: inline-block !important;
  width: auto !important;
  max-width: max-content !important;
  vertical-align: middle;
}
/* /ID зона по тексту */

/* таблица по содержимому — убрать зазоры столбцов (вкл. ID) */
.tr-app .payin-orders-table { width: auto !important; max-width: 100%; }
.tr-app .payin-orders-table colgroup { display: none !important; }
/* /таблица по содержимому */

/* таблица заполняет ширину; лишнее место — столбцу «Реквізит», ID остаётся плотным */
.tr-app .payin-orders-table { width: 100% !important; }
.tr-app .payin-orders-table th:nth-child(5),
.tr-app .payin-orders-table td:nth-child(5) { width: 100% !important; }
/* /таблица заполняет ширину */

/* PayOut: лишнее место отдаём «Получателю» (6), а не «Реквізиту» (5) —
   чтобы получатель стоял вплотную к реквизиту, без большого зазора. */
.tr-app .payout-orders-table th:nth-child(5),
.tr-app .payout-orders-table td:nth-child(5) { width: auto !important; }
.tr-app .payout-orders-table th:nth-child(6),
.tr-app .payout-orders-table td:nth-child(6) { width: 100% !important; }
/* /PayOut: получатель вплотную к реквизиту */

/* PayOut: компактнее строки таблиц (меньше высота) */
.tr-app .payout-orders-table td {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
.tr-app .payout-orders-table .payin-sub-amount { margin-top: 1px !important; }
.tr-app td.payout-actions .payout-actions-inner { gap: 4px; }
/* кнопки действий компактнее — две столбиком меньше задирают высоту строки */
.tr-app td.payout-actions .payout-actions-inner button.payout-claim-btn,
.tr-app td.payout-actions .payout-actions-inner button.payout-close-btn,
.tr-app td.payout-actions .payout-actions-inner button.payout-release-btn {
  min-height: 24px;
  padding: 3px 10px;
  font-size: 0.72rem;
  line-height: 1.2;
}
/* /PayOut: компактные строки */

/* кастомный курсор-иконка копирования на ID */
.tr-app .payin-req-id.op-copy-id {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26'%3E%3Crect x='9' y='9' width='14' height='14' rx='3' fill='%23ffffff' stroke='%230f172a' stroke-width='2'/%3E%3Crect x='4' y='4' width='14' height='14' rx='3' fill='%23ffffff' stroke='%230f172a' stroke-width='2'/%3E%3C/svg%3E") 5 5, pointer !important;
}
/* /кастомный курсор копирования */

/* меньший и аккуратный курсор-иконка копирования */
.tr-app .payin-req-id.op-copy-id {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Crect x='2.5' y='2.5' width='9' height='9' rx='2' fill='%23ffffff' stroke='%230f172a' stroke-width='1.4'/%3E%3Crect x='6' y='6' width='9' height='9' rx='2' fill='%23ffffff' stroke='%230f172a' stroke-width='1.4'/%3E%3C/svg%3E") 4 4, pointer !important;
}
/* /меньший курсор копирования */

/* выравнивание двух последних колонок PayIn: «Дедлайн» — по правому краю,
   действия (кнопка ✓) — по центру в фикс-ширине. Отменяет общий
   text-align:left/width:auto, который сбивал эти столбцы.
   Скоуп :not(.payout-orders-table) — чтобы не задевать таблицы PayOut
   (там 6-я колонка — «Получатель», а последняя — двойные кнопки выплат). */
.tr-app .payin-orders-table:not(.payout-orders-table) th:nth-child(6),
.tr-app .payin-orders-table:not(.payout-orders-table) td:nth-child(6) {
  text-align: right !important;
}
.tr-app .payin-orders-table:not(.payout-orders-table) th:last-child,
.tr-app .payin-orders-table:not(.payout-orders-table) td.payin-actions {
  text-align: center !important;
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
}
.tr-app .payin-orders-table:not(.payout-orders-table) td.payin-actions .payin-confirm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  float: none;
}
/* /выравнивание «Дедлайн» + действия */

/* ============================================================
   Мобильный кабинет трейдера: компактный режим.
   Сайдбар превращается в выезжающую панель (off-canvas) с бургером
   в топбаре — вместо прежней «стопки» во всю ширину над контентом.
   Контент занимает всю ширину, ничего не «разбрасывается».
   ============================================================ */
.tr-app .tr-nav-toggle { display: none; }
.tr-app .tr-nav-backdrop { display: none; }

@media (max-width: 900px) {
  /* контент на всю ширину — без резерва под сайдбар */
  .tr-app .tr-shell { padding-left: 0 !important; }

  /* сайдбар — выезжающая панель слева (сплошной фон: перекрываем
     прозрачность из «Minimal»-блока, иначе контент просвечивает) */
  .tr-app .tr-sidebar {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: min(280px, 84vw) !important;
    height: 100dvh !important;
    min-height: 0 !important;
    grid-template-rows: auto 1fr auto;
    transform: translateX(-100%);
    transition: transform 0.26s ease;
    z-index: 90;
    background: #0b0e18 !important;
    border-right: 1px solid var(--tr-line) !important;
    box-shadow: 0 0 48px rgba(0, 0, 0, 0.6) !important;
    overflow-y: auto;
  }
  .tr-shell--nav-open .tr-sidebar { transform: none; }

  /* затемнение под открытым меню */
  .tr-app .tr-nav-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(0, 0, 0, 0.55);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.26s ease;
  }
  .tr-shell--nav-open .tr-nav-backdrop { opacity: 1; pointer-events: auto; }

  /* бургер в топбаре */
  .tr-app .tr-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex: none;
    border-radius: 10px;
    border: 1px solid var(--tr-line);
    background: rgba(255, 255, 255, 0.04);
    color: var(--tr-text);
    cursor: pointer;
  }
  .tr-app .tr-nav-toggle:hover { background: rgba(255, 255, 255, 0.08); }

  /* топбар компактнее: заголовок + бургер в строке, действия — ниже */
  .tr-app .tr-topbar {
    gap: 10px;
    padding: 10px 14px;
    flex-wrap: wrap;
  }
  .tr-app .tr-topbar-head { min-width: 0; flex: 1; }
  .tr-app .tr-topbar h1 {
    font-size: 1.15rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .tr-app .tr-topbar-kicker { font-size: 0.68rem; }
  .tr-app .tr-topbar-actions {
    width: 100%;
    gap: 8px;
    justify-content: flex-start;
  }

  /* меньше внутренних отступов рабочей области */
  .tr-app .tr-workspace { padding: 12px 12px 20px; }
}

@media (max-width: 560px) {
  /* компактные сетки — по две карточки в ряд, без «разброса» */
  .tr-app .tr-dash-metrics { grid-template-columns: 1fr 1fr; }
  .tr-app .tr-dash-mini-grid { grid-template-columns: 1fr 1fr; }
  .tr-app .payin-kpi-grid { grid-template-columns: 1fr 1fr; }
  .tr-app .kpis,
  .tr-app .kpis-3 { grid-template-columns: 1fr 1fr; }
  .tr-app .tr-topbar h1 { font-size: 1.05rem; }
  .tr-app .tr-workspace { padding: 10px 10px 18px; }
}

/* ------------------------------------------------------------
   Таблицы → карточки на телефоне. Каждая строка становится
   блоком «поле: значение» (подпись из data-label, проставляется
   в labelTableCells). Убирает горизонтальный скролл — читать легко.
   ------------------------------------------------------------ */
@media (max-width: 640px) {
  .tr-app .tr-page table,
  .tr-app .tr-page table tbody {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
  }

  .tr-app .tr-page table thead { display: none; }

  .tr-app .tr-page table tr {
    display: block;
    border: 1px solid var(--tr-line);
    border-radius: 12px;
    margin-bottom: 10px;
    padding: 6px 12px;
    background: rgba(255, 255, 255, 0.02);
  }
  .tr-app .tr-page table tbody tr:hover td { background: transparent !important; }

  .tr-app .tr-page table td {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 6px 0 !important;
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    white-space: normal !important;
    text-align: right !important;
    overflow: visible !important;
  }
  .tr-app .tr-page table tr td:last-child { border-bottom: none !important; }

  /* подпись поля слева */
  .tr-app .tr-page table td[data-label]::before {
    content: attr(data-label);
    color: var(--tr-muted);
    font-weight: 600;
    font-size: 0.72rem;
    letter-spacing: 0.01em;
    text-align: left;
    flex: none;
    white-space: nowrap;
  }

  /* пустые ячейки без данных не занимают строку */
  .tr-app .tr-page table td:empty { display: none !important; }

  /* длинный ID — обрезаем с многоточием (полный по тапу-копированию) */
  .tr-app .tr-page table td .payin-req-id {
    max-width: 62vw !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    display: inline-block !important;
  }

  /* суммы/реквизиты — выравниваем содержимое ячейки вправо */
  .tr-app .tr-page table td .payin-amount,
  .tr-app .tr-page table td .payin-sub-amount,
  .tr-app .tr-page table td .payin-beneficiary,
  .tr-app .tr-page table td .mono {
    text-align: right;
  }
  .tr-app .tr-page table td > div { min-width: 0; }

  /* действия (кнопки) — ячейка без заголовка: прижать содержимое вправо */
  .tr-app .tr-page table td.payin-actions,
  .tr-app .tr-page table td.payout-actions,
  .tr-app .tr-page table td:not([data-label]) {
    justify-content: flex-end !important;
  }
  .tr-app .tr-page table td.payin-actions .payin-confirm-btn { margin: 0 !important; }

  /* контейнер таблицы больше не скроллится вбок */
  .tr-app .tr-page .payin-table-wrap { overflow-x: visible; }

  /* На телефоне отказываемся от модели «панель фиксированной высоты +
     внутренний скролл» (особенно стакан PayOut 4:3, который схлопывался
     в 1px). Контент течёт по документу — карточки видны целиком. */
  .tr-app .tr-page > .payin-panel,
  .tr-app .tr-page > .panel,
  .tr-app .tr-page > section.panel,
  .tr-app .tr-page--payout > .payout-pool-panel,
  .tr-app .tr-page--payout > .payout-orders-panel,
  .tr-app .tr-page > .tr-settings-page,
  .tr-app .tr-page > section.tr-settings-table {
    flex: none !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }
  .tr-app .tr-page .panel > .table-wrap,
  .tr-app .tr-page .payin-table-wrap,
  .tr-app .tr-page .payin-table-wrap .table-wrap,
  .tr-app .tr-page .table-wrap {
    flex: none !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
}
/* /мобильный кабинет трейдера */

/* ============================================================
   СВЕТЛАЯ ТЕМА КАБИНЕТА ТРЕЙДЕРА — «необанк» (Level A, чистый CSS).
   Скоуп: только страница кабинета (html[data-app-scope="trader"])
   и только при выбранной светлой теме (body[data-theme="light"]).
   Админку/мерчанта не затрагивает. Дефолт кабинета — светлая
   (см. cabinetThemeDefault в core.js). Токены перекрашивают
   бóльшую часть; ниже — точечные оверрайды хардкод-цветов.
   ============================================================ */
html[data-app-scope="trader"] body.tr-app[data-theme="light"]{
  --tr-bg:#f4f6fa;                  /* спокойная светлая подложка — карточки читаются, фон не спорит */
  --tr-surface:#ffffff;
  --tr-surface-2:#eef1f8;
  --tr-line:#e3e8f1;
  --tr-purple:#3d54e0;              /* индиго-акцент необанка */
  --tr-purple-soft:rgba(61,84,224,.12);
  --tr-text:#161b2b;
  --tr-muted:#68708a;
  color:var(--tr-text);
  background:
    radial-gradient(780px 440px at 88% -6%, rgba(61,84,224,.045), transparent 62%),
    var(--tr-bg) !important;
}

/* фон экрана логина */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-login-wrap{
  background:radial-gradient(900px 480px at 50% -12%, rgba(61,84,224,.07), transparent), var(--tr-bg);
}

/* сайдбар/топбар стилизуются ниже — в блоке «плавающая оболочка» (обе темы) */

/* карточки дашборда — белая поверхность вместо прозрачной «KPI-минимал»,
   перекрываем background/border/box-shadow из тёмного блока (все с !important) */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-dash-metric,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-dash-chart-card,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-dash-table-card,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-dash-mini{
  background:var(--tr-surface) !important;
  border:1px solid var(--tr-line) !important;
  box-shadow:0 1px 2px rgba(22,27,43,.04), 0 10px 26px -12px rgba(30,40,90,.14) !important;
}

/* прочие панели/поверхности — мягкая глубина */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .panel,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .payin-panel,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .kpi,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .table-panel,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-topup-panel,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-profit-transfer-panel{
  box-shadow:0 1px 2px rgba(22,27,43,.04), 0 8px 22px rgba(30,40,90,.06);
}
/* ЛЮБАЯ .panel в кабинете — белая карточка (admin.css грузится позже и
   делает вложенные панели прозрачными: настройки, доход депозита и т.п.) */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .panel{
  background:var(--tr-surface) !important;
  border:1px solid var(--tr-line) !important;
  border-radius:16px !important;
}

/* чипы топбара и иконки метрик — светлые поверхности вместо white-alpha */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-balance-chip,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-rate-chip,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-traffic-chip{
  border:1px solid var(--tr-line) !important;
  background:var(--tr-surface) !important;
}
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-dash-metric-icon{
  border:1px solid var(--tr-line) !important;
}
/* ховер строки таблицы — мягкий индиго вместо фиолетового */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] tbody tr:hover td{
  background:rgba(61,84,224,.05) !important;
}
/* ховеры/границы кнопок из тёмной палитры */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-icon-btn:hover{
  border-color:#c3ccdd;
}

/* акцентная кнопка/бренд-градиент → индиго */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-login-brand .tr-brand-icon,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .t-avatar{
  background:linear-gradient(135deg,#5468ff,#3d54e0);
  color:#fff;
}

/* тёмные пилюли статусов на светлом — приглушаем фон, сохраняем семантику */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .status{
  border-color:transparent;
}

/* поля ввода/селекты — светлые */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] input,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] select,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] textarea{
  background:#ffffff;
  border-color:var(--tr-line);
  color:var(--tr-text);
  color-scheme:light;
}
html[data-app-scope="trader"] body.tr-app[data-theme="light"] input::placeholder{color:#a2a9bd;}

/* заголовки таблиц — светлые вместо тёмных (перекрываем захардкоженный dark) */
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .table-wrap table thead th,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .payin-orders-table th,
html[data-app-scope="trader"] body.tr-app[data-theme="light"] .tr-dash-table-card th{
  background:#f2f5fb !important;
  color:var(--tr-muted) !important;
  box-shadow:0 1px 0 var(--tr-line) !important;
}
/* /светлая тема кабинета */

/* ==================================================================
   Необанк-дашборд трейдера (концепт #3). На токенах --tr-* → работает
   и в светлой, и в тёмной теме. Семантические цвета — свои --n-*.
   ================================================================== */
.tr-app .tr-neo{
  --n-green:#12a06a; --n-green-2:#e5f6ee;
  --n-amber:#e0900c; --n-amber-2:#fbf1dd;
  --n-violet:#7b5cf0; --n-violet-2:#f0ecff;
  --n-red:#e5484d;
  --n-r:18px;
  --n-sh:0 1px 2px rgba(22,27,43,.05), 0 10px 26px -14px rgba(30,40,90,.20);
  display:flex; flex-direction:column; gap:16px;
  font-variant-numeric:tabular-nums;
}
body.tr-app[data-theme="dark"] .tr-neo{
  --n-green:#2ee6a0; --n-green-2:rgba(46,230,160,.14);
  --n-amber:#ffb24d; --n-amber-2:rgba(255,178,77,.14);
  --n-violet:#7ab0ff; --n-violet-2:rgba(167,139,250,.14);
  --n-red:#ff6b74;
  --n-sh:0 1px 2px rgba(0,0,0,.4), 0 16px 34px -20px rgba(0,0,0,.75);
}
.tr-app .tr-neo .n-card{ background:var(--tr-surface); border:1px solid var(--tr-line); border-radius:var(--n-r); box-shadow:var(--n-sh); }
.tr-app .tr-neo .n-num{ font-variant-numeric:tabular-nums; letter-spacing:-.015em; }
.tr-app .tr-neo .n-ey{ font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--tr-muted); }

/* greeting */
.tr-app .tr-neo .n-hello{ display:flex; align-items:center; gap:14px; }
.tr-app .tr-neo .n-hello .n-k{ font-size:12.5px; color:var(--tr-muted); }
.tr-app .tr-neo .n-hello h2{ margin:2px 0 0; font-size:21px; font-weight:750; letter-spacing:-.02em; color:var(--tr-text); }
.tr-app .tr-neo .n-live{ margin-left:auto; display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 13px; border-radius:11px; background:var(--tr-surface); border:1px solid var(--tr-line); box-shadow:var(--n-sh); font-size:13px; font-weight:600; color:var(--tr-text); }
.tr-app .tr-neo .n-live .n-dot{ width:8px; height:8px; border-radius:50%; background:var(--n-green); }
.tr-app .tr-neo .n-live .n-rate{ color:var(--tr-muted); font-weight:500; }

/* balances */
.tr-app .tr-neo .n-bal{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:13px; }
.tr-app .tr-neo .n-hero{ grid-column:1; padding:20px 22px; border-radius:var(--n-r); color:#fff; position:relative; overflow:hidden; background:linear-gradient(145deg,#4a5ef0,#3345c4); box-shadow:0 2px 6px rgba(22,27,43,.08), 0 22px 46px -20px rgba(51,69,196,.6); }
.tr-app .tr-neo .n-hero::after{ content:""; position:absolute; right:-60px; top:-60px; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.16),transparent 68%); }
.tr-app .tr-neo .n-hero .n-ey{ color:rgba(255,255,255,.72); }
.tr-app .tr-neo .n-hero .n-big{ font-size:34px; font-weight:750; letter-spacing:-.03em; margin-top:9px; line-height:1; }
.tr-app .tr-neo .n-hero .n-big .u{ font-size:16px; opacity:.75; font-weight:600; }
.tr-app .tr-neo .n-hero .n-row{ display:flex; align-items:center; justify-content:space-between; margin-top:15px; }
.tr-app .tr-neo .n-hero .n-uah{ font-size:13px; color:rgba(255,255,255,.82); }
.tr-app .tr-neo .n-hero .n-chg{ display:inline-flex; gap:5px; align-items:center; font-size:12px; font-weight:700; background:rgba(255,255,255,.18); padding:3px 9px; border-radius:999px; }
.tr-app .tr-neo .n-mini{ padding:15px 17px; display:flex; flex-direction:column; gap:5px; border-radius:var(--n-r); }
.tr-app .tr-neo .n-mini .n-val{ font-size:22px; font-weight:750; letter-spacing:-.02em; color:var(--tr-text); }
.tr-app .tr-neo .n-mini .n-val.g{ color:var(--n-green); }
.tr-app .tr-neo .n-mini .n-val.o{ color:var(--n-amber); }
.tr-app .tr-neo .n-mini .n-val.v{ color:var(--n-violet); }
.tr-app .tr-neo .n-mini .n-sub{ font-size:12px; color:var(--tr-muted); }

/* main grid */
.tr-app .tr-neo .n-main{ display:grid; grid-template-columns:1.55fr 1fr; gap:16px; align-items:start; }
.tr-app .tr-neo .n-col{ display:flex; flex-direction:column; gap:16px; min-width:0; }
.tr-app .tr-neo .n-ch{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:16px 18px 6px; }
.tr-app .tr-neo .n-ch h3{ margin:0; font-size:15px; font-weight:700; letter-spacing:-.01em; color:var(--tr-text); }
.tr-app .tr-neo .n-ch .n-meta{ font-size:12px; color:var(--tr-muted); }
.tr-app .tr-neo .n-cb{ padding:0 18px 18px; }

/* income */
.tr-app .tr-neo .n-inc-top{ display:flex; align-items:flex-end; gap:13px; padding:2px 18px 8px; }
.tr-app .tr-neo .n-inc-big{ font-size:28px; font-weight:750; letter-spacing:-.02em; color:var(--n-green); }
.tr-app .tr-neo .n-inc-sub{ font-size:12.5px; color:var(--tr-muted); padding-bottom:5px; }
.tr-app .tr-neo .n-range{ margin-left:auto; display:flex; gap:2px; }
.tr-app .tr-neo .n-range button{ border:0; background:transparent; color:var(--tr-muted); font:inherit; font-size:12px; font-weight:600; padding:5px 10px; border-radius:9px; cursor:pointer; }
.tr-app .tr-neo .n-range button.on{ background:var(--tr-purple-soft); color:var(--tr-purple); }
.tr-app .tr-neo .n-svg{ display:block; width:100%; }
.tr-app .tr-neo .n-axis{ display:flex; justify-content:space-between; font-size:11px; color:var(--tr-muted); padding:8px 18px 0; }

/* active orders segmented (pure CSS radio) */
.tr-app .tr-neo .n-seg{ display:inline-flex; background:var(--tr-surface-2); border-radius:11px; padding:3px; }
.tr-app .tr-neo .n-seg label{ color:var(--tr-muted); font-size:12.5px; font-weight:600; padding:6px 12px; border-radius:8px; cursor:pointer; display:inline-flex; gap:7px; align-items:center; }
.tr-app .tr-neo .n-seg .n-c{ font-size:11px; font-weight:700; background:var(--tr-line); color:var(--tr-muted); border-radius:6px; padding:0 6px; }
.tr-app .tr-neo .n-active input{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.tr-app .tr-neo .n-deals-out{ display:none; }
.tr-app .tr-neo #neo-seg-out:checked ~ .n-cb .n-deals-in{ display:none; }
.tr-app .tr-neo #neo-seg-out:checked ~ .n-cb .n-deals-out{ display:block; }
.tr-app .tr-neo #neo-seg-in:checked ~ .n-ch .lbl-in,
.tr-app .tr-neo #neo-seg-out:checked ~ .n-ch .lbl-out{ background:var(--tr-surface); color:var(--tr-text); box-shadow:var(--n-sh); }
.tr-app .tr-neo #neo-seg-in:checked ~ .n-ch .lbl-in .n-c,
.tr-app .tr-neo #neo-seg-out:checked ~ .n-ch .lbl-out .n-c{ background:var(--tr-purple); color:#fff; }

/* deal row */
.tr-app .tr-neo .n-deal{ display:grid; grid-template-columns:38px 1fr auto auto; align-items:center; gap:13px; padding:13px 0; border-top:1px solid var(--tr-line); }
.tr-app .tr-neo .n-deal:first-child{ border-top:0; }
.tr-app .tr-neo .n-dt{ width:38px; height:38px; border-radius:12px; display:grid; place-items:center; font-size:11px; font-weight:750; letter-spacing:.02em; }
.tr-app .tr-neo .n-dt.in{ background:var(--n-green-2); color:var(--n-green); }
.tr-app .tr-neo .n-dt.out{ background:var(--n-amber-2); color:var(--n-amber); }
.tr-app .tr-neo .n-pan{ font-size:14px; font-weight:600; letter-spacing:.01em; color:var(--tr-text); }
.tr-app .tr-neo .n-dmeta{ font-size:12px; color:var(--tr-muted); margin-top:2px; }
.tr-app .tr-neo .n-amt{ text-align:right; }
.tr-app .tr-neo .n-amt .a{ font-size:15px; font-weight:750; letter-spacing:-.01em; color:var(--tr-text); }
.tr-app .tr-neo .n-amt .b{ font-size:11.5px; color:var(--tr-muted); margin-top:2px; }
.tr-app .tr-neo .n-clk{ text-align:right; min-width:62px; }
.tr-app .tr-neo .n-clk .t{ font-size:15px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--tr-text); }
.tr-app .tr-neo .n-clk.hot .t{ color:var(--n-red); }
.tr-app .tr-neo .n-clk .l{ font-size:10px; color:var(--tr-muted); font-weight:600; text-transform:uppercase; letter-spacing:.05em; margin-top:2px; }
.tr-app .tr-neo .n-empty{ padding:22px 0; text-align:center; color:var(--tr-muted); font-size:13px; }

/* boost promo */
.tr-app .tr-neo .n-boost{ background:linear-gradient(150deg,var(--n-violet-2),var(--tr-purple-soft)); border:1px solid var(--tr-line); }
.tr-app .tr-neo .n-boost .n-ey{ color:var(--n-violet); }
.tr-app .tr-neo .n-boost h3{ margin:9px 0 5px; font-size:16px; font-weight:750; color:var(--tr-text); }
.tr-app .tr-neo .n-boost p{ margin:0 0 14px; font-size:12.5px; color:var(--tr-muted); line-height:1.5; }
.tr-app .tr-neo .n-boost-btn{ width:100%; border:0; cursor:pointer; font:inherit; font-weight:700; font-size:13.5px; color:#fff; padding:12px; border-radius:13px; background:linear-gradient(135deg,#8b7bff,#5b9dff); box-shadow:0 8px 20px -6px rgba(59, 130, 246,.5); }
.tr-app .tr-neo .n-boost-meta{ display:flex; justify-content:space-between; margin-top:12px; font-size:11.5px; color:var(--tr-muted); }
.tr-app .tr-neo .n-boost-meta b{ color:var(--tr-text); font-weight:700; }

/* conversion */
.tr-app .tr-neo .n-conv{ display:flex; align-items:center; gap:16px; }
.tr-app .tr-neo .n-lg{ display:flex; flex-direction:column; gap:9px; flex:1; font-size:12.5px; }
.tr-app .tr-neo .n-lg .r{ display:flex; align-items:center; gap:9px; color:var(--tr-muted); }
.tr-app .tr-neo .n-lg .d{ width:9px; height:9px; border-radius:3px; }
.tr-app .tr-neo .n-lg b{ margin-left:auto; font-weight:700; font-variant-numeric:tabular-nums; color:var(--tr-text); }

/* quick actions */
.tr-app .tr-neo .n-qa{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.tr-app .tr-neo .n-qa a{ display:flex; align-items:center; gap:10px; border:1px solid var(--tr-line); background:var(--tr-surface); color:var(--tr-text); font:inherit; font-size:12.5px; font-weight:600; padding:11px 12px; border-radius:13px; cursor:pointer; box-shadow:var(--n-sh); text-decoration:none; }
.tr-app .tr-neo .n-qa .ic{ width:31px; height:31px; border-radius:10px; display:grid; place-items:center; font-size:15px; }
.tr-app .tr-neo .n-qa .ic.i{ background:var(--tr-purple-soft); color:var(--tr-purple); }
.tr-app .tr-neo .n-qa .ic.g{ background:var(--n-green-2); color:var(--n-green); }
.tr-app .tr-neo .n-qa .ic.a{ background:var(--n-amber-2); color:var(--n-amber); }
.tr-app .tr-neo .n-qa .ic.v{ background:var(--n-violet-2); color:var(--n-violet); }

@media(max-width:1000px){
  .tr-app .tr-neo .n-main{ grid-template-columns:1fr; }
  .tr-app .tr-neo .n-bal{ grid-template-columns:1fr 1fr; }
  .tr-app .tr-neo .n-hero{ grid-column:1 / -1; }
}
@media(max-width:560px){
  .tr-app .tr-neo .n-bal{ grid-template-columns:1fr; }
  .tr-app .tr-neo .n-deal{ grid-template-columns:38px 1fr auto; row-gap:4px; }
  .tr-app .tr-neo .n-clk{ grid-column:2/4; text-align:left; display:flex; gap:8px; align-items:baseline; }
  .tr-app .tr-neo .n-clk .l{ margin:0; }
}

/* ==================================================================
   Плавающая оболочка кабинета (рейл 02 + значки N1 + топбар T1).
   Токены --tr-* → работает в светлой и тёмной темах.
   Скоуп html[data-app-scope="trader"] — админку не трогаем.
   ================================================================== */
html[data-app-scope="trader"] body.tr-app{ --tr-shell-gap:14px; }

/* --- сайдбар: плавающая карточка (только десктоп; мобайл — off-canvas ниже) --- */
@media (min-width: 901px){
  html[data-app-scope="trader"] body.tr-app .tr-sidebar{
    inset:var(--tr-shell-gap) auto var(--tr-shell-gap) var(--tr-shell-gap) !important;
    width:calc(var(--tr-sidebar-w) - var(--tr-shell-gap)) !important;
    background:var(--tr-surface) !important;
    border:1px solid var(--tr-line) !important;
    border-radius:16px !important;
    box-shadow:0 2px 6px rgba(22,27,43,.05), 0 18px 40px -24px rgba(30,40,90,.3) !important;
    overflow:hidden;
  }
}
html[data-app-scope="trader"] body.tr-app .tr-brand{ border-bottom:1px solid var(--tr-line); }

/* навигация: активный пункт — залитая индиго-пилюля */
html[data-app-scope="trader"] body.tr-app .tr-side-link{
  border-radius:12px;
  font-weight:600;
  color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .tr-side-link:hover{
  background:var(--tr-surface-2);
  color:var(--tr-text);
}
html[data-app-scope="trader"] body.tr-app .tr-side-link.active{
  background:var(--tr-purple) !important;
  color:#fff !important;
  box-shadow:0 8px 18px -8px rgba(61,84,224,.6) !important;
}
html[data-app-scope="trader"] body.tr-app .tr-side-link.active .tr-side-icon{ color:#fff !important; }

/* контурные SVG-значки */
html[data-app-scope="trader"] body.tr-app .tr-side-icon{
  width:18px; height:18px; flex:none;
  display:inline-grid; place-items:center;
  opacity:1; color:inherit;
}
html[data-app-scope="trader"] body.tr-app .tr-side-icon svg{
  width:18px; height:18px; display:block;
  /* admin.css красит navi-svg заливкой (fill:currentColor; stroke:none) —
     для контурного набора N1 возвращаем штрих */
  fill:none !important;
  stroke:currentColor !important;
}

/* счётчик заявок у вкладки — пилюля справа */
html[data-app-scope="trader"] body.tr-app .tr-side-label{ flex:1 1 auto; }
html[data-app-scope="trader"] body.tr-app .tr-side-count{
  margin-left:auto; flex:none;
  min-width:20px; height:20px; padding:0 6px; box-sizing:border-box;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:.68rem; font-weight:700; line-height:1; font-variant-numeric:tabular-nums;
  border-radius:999px;
  background:var(--tr-purple-soft); color:var(--tr-purple);
}
html[data-app-scope="trader"] body.tr-app .tr-side-count[hidden]{ display:none; }
html[data-app-scope="trader"] body.tr-app .tr-side-link.active .tr-side-count{
  background:rgba(255,255,255,.22); color:#fff;
}

/* профиль внизу рейла — карточка */
html[data-app-scope="trader"] body.tr-app .tr-profile{
  margin:10px;
  padding:10px 12px;
  border:1px solid var(--tr-line) !important;
  border-radius:14px;
  background:var(--tr-surface-2) !important;
}
html[data-app-scope="trader"] body.tr-app .tr-profile-avatar{
  border-radius:11px;
  background:var(--tr-purple-soft);
  color:var(--tr-purple);
}

/* --- топбар: плавающая карточка-чипы --- */
html[data-app-scope="trader"] body.tr-app .tr-topbar{
  margin:var(--tr-shell-gap) var(--tr-shell-gap) 0 var(--tr-shell-gap);
  padding:10px 16px;
  background:var(--tr-surface) !important;
  border:1px solid var(--tr-line) !important;
  border-bottom:1px solid var(--tr-line) !important;
  border-radius:15px !important;
  box-shadow:0 2px 6px rgba(22,27,43,.05), 0 14px 32px -22px rgba(30,40,90,.35) !important;
}

/* чипы топбара — единая высота/радиус, компактный ряд без переноса (десктоп) */
@media (min-width: 901px){
  html[data-app-scope="trader"] body.tr-app .tr-topbar-actions{
    gap:8px;
    flex-wrap:nowrap;
  }
  html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-chip{ min-width:0; }
}
html[data-app-scope="trader"] body.tr-app .tr-rate-chip{
  height:36px;
  padding:0 11px;
  display:inline-flex; align-items:center;
  border-radius:11px !important;
  background:var(--tr-surface) !important;
  border:1px solid var(--tr-line) !important;
  color:var(--tr-text) !important;
  font-size:.85rem;
  box-shadow:0 1px 2px rgba(22,27,43,.04);
}
html[data-app-scope="trader"] body.tr-app .tr-traffic-chip{
  height:36px;
  padding:0 10px 0 12px;
  border-radius:11px !important;
  background:var(--tr-surface) !important;
  border:1px solid var(--tr-line) !important;
  box-shadow:0 1px 2px rgba(22,27,43,.04);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-chip{
  border-radius:11px !important;
  box-shadow:0 1px 2px rgba(22,27,43,.04);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-wrap.open .tr-balance-chip{
  background:var(--tr-surface-2);
  border-color:var(--tr-purple);
}
html[data-app-scope="trader"] body.tr-app .tr-icon-btn{ border-radius:11px; }

/* значки топбара — контур N1: admin.css заливает их (fill:currentColor; stroke:none),
   возвращаем штрих для темы/колокольчика и любых svg внутри icon-кнопок */
html[data-app-scope="trader"] body.tr-app .tr-icon-btn > svg,
html[data-app-scope="trader"] body.tr-app .tr-icon-btn .op-svg svg{
  width:17px !important;
  height:17px !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.7px;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* баланс — однострочный чип: ЛЕЙБЛ · значение · шеврон */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-chip{
  flex-direction:row !important;
  align-items:center !important;
  gap:8px;
  height:36px;
  min-width:0;
  padding:0 26px 0 12px !important;
  line-height:1;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-chip span:first-child{
  font-size:.625rem;
  font-weight:700;
  letter-spacing:.05em;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-chip strong{
  font-size:.85rem;
  /* перебиваем мятный из aurora-блока (там !important) — цифры должны читаться */
  color:var(--tr-text) !important;
}

/* язык — сегмент на подложке */
html[data-app-scope="trader"] body.tr-app .tr-lang-switch{
  background:var(--tr-surface-2);
  border:0;
  border-radius:11px;
  padding:3px;
}
html[data-app-scope="trader"] body.tr-app .tr-lang-btn.is-active{
  background:var(--tr-surface);
  color:var(--tr-text);
  box-shadow:0 1px 2px rgba(22,27,43,.08);
}

/* Boost — фиолетовый градиентный чип с молнией */
html[data-app-scope="trader"] body.tr-app .tr-turbo-btn{
  height:36px;
  padding:0 14px;
  border-radius:11px !important;
  border:0 !important;
  background:linear-gradient(135deg,#8b7bff,#5b9dff) !important;
  color:#fff !important;
  box-shadow:0 5px 13px -4px rgba(59, 130, 246,.5) !important;
}
html[data-app-scope="trader"] body.tr-app .tr-turbo-btn:hover:not(:disabled){
  background:linear-gradient(135deg,#978aff,#7a69f6) !important;
  border:0 !important;
  color:#fff !important;
}
html[data-app-scope="trader"] body.tr-app .tr-turbo-btn.is-active{
  box-shadow:0 0 0 2px rgba(59, 130, 246,.30), 0 5px 13px -4px rgba(59, 130, 246,.55) !important;
}
html[data-app-scope="trader"] body.tr-app .tr-turbo-ic{ display:inline-grid; place-items:center; }
html[data-app-scope="trader"] body.tr-app .tr-turbo-ic svg{ width:15px; height:15px; display:block; }
html[data-app-scope="trader"] body.tr-app .tr-turbo-timer{
  color:#fff !important;
  background:rgba(255,255,255,.22);
  padding:1px 7px;
  border-radius:7px;
  font-size:.68rem !important;
  min-width:0 !important;
  text-align:center !important;
}
html[data-app-scope="trader"] body.tr-app .tr-turbo-timer:empty{ display:none; }

/* мобильный off-canvas: сплошная поверхность по теме (вместо тёмного хардкода) */
@media (max-width: 900px){
  html[data-app-scope="trader"] body.tr-app .tr-sidebar{
    background:var(--tr-surface) !important;
    border-right:1px solid var(--tr-line) !important;
  }
  html[data-app-scope="trader"] body.tr-app .tr-topbar{
    margin:10px 10px 0 10px;
  }
}
/* /плавающая оболочка */

/* --- дропдаун уведомлений: необанк-карточка --- */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-panel{
  width:330px;
  border-radius:16px;
  background:var(--tr-surface);
  border:1px solid var(--tr-line);
  box-shadow:0 2px 6px rgba(22,27,43,.06), 0 24px 54px -22px rgba(30,40,90,.45);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-header{
  padding:12px 14px 11px;
  font-size:.7rem;
  letter-spacing:.07em;
  background:var(--tr-surface);
  border-bottom:1px solid var(--tr-line);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-close{
  width:26px; height:26px;
  display:grid; place-items:center;
  padding:0;
  border-radius:8px;
  background:var(--tr-surface-2);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-item{
  padding:11px 14px;
  border-bottom:1px solid var(--tr-line);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-item:hover{
  background:var(--tr-surface-2);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-item--unread{
  background:var(--tr-purple-soft);
  border-left:2px solid var(--tr-purple);
}
/* иконка — контурный значок в мягкой индиго-плашке */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-icon{
  width:30px; height:30px; flex:none;
  display:grid; place-items:center;
  border-radius:9px;
  background:var(--tr-purple-soft);
  color:var(--tr-purple);
  font-size:0;
  line-height:0;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-icon svg{
  width:15px; height:15px; display:block;
  fill:none !important;
  stroke:currentColor !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-text{ color:var(--tr-muted); }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-notif-time{
  font-size:.68rem;
  color:var(--tr-muted);
  opacity:.75;
  margin-top:3px;
}

/* --- дропдаун баланса: необанк-карточка --- */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-menu{
  min-width:240px;
  padding:8px;
  border-radius:14px;
  background:var(--tr-surface);
  border:1px solid var(--tr-line);
  box-shadow:0 2px 6px rgba(22,27,43,.06), 0 24px 54px -22px rgba(30,40,90,.45);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-row{
  padding:10px 11px;
  border-radius:10px;
  border-bottom:1px solid var(--tr-line);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-row:nth-last-of-type(1){ border-bottom:0; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-row:hover{
  background:var(--tr-purple-soft);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-row span{
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-row strong{
  color:var(--tr-text);
  font-size:.875rem;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-row strong.tr-bal-profit{ color:#12a06a; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin[data-theme="dark"] .tr-balance-row strong.tr-bal-profit{ color:#2ee6a0; }

/* кнопка «перевести доход» — мягкий зелёный чип */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-transfer{
  margin:6px 4px 4px;
  width:calc(100% - 8px);
  padding:11px 12px;
  border-radius:11px;
  border:1px solid rgba(18,160,106,.3);
  background:rgba(18,160,106,.1);
  color:#12a06a;
  font-weight:700;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-transfer:hover:not(:disabled){
  background:rgba(18,160,106,.18);
  border-color:rgba(18,160,106,.5);
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin[data-theme="dark"] .tr-balance-transfer{ color:#2ee6a0; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-transfer:disabled{ opacity:.55; cursor:default; }
/* /дропдауны */

/* --- необанк-дашборд: типографика на ступень меньше --- */
.tr-app .tr-neo .n-hello h2{ font-size:18px; }
.tr-app .tr-neo .n-live{ font-size:12px; height:36px; }
.tr-app .tr-neo .n-ey{ font-size:10.5px; }
.tr-app .tr-neo .n-hero .n-big{ font-size:28px; }
.tr-app .tr-neo .n-hero .n-big .u{ font-size:14px; }
.tr-app .tr-neo .n-hero .n-uah{ font-size:12px; }
.tr-app .tr-neo .n-hero .n-chg{ font-size:11px; }
.tr-app .tr-neo .n-mini .n-val{ font-size:19px !important; } /* перебивает inline 20px у нижних мини-карт */
.tr-app .tr-neo .n-mini .n-sub{ font-size:11.5px; }
.tr-app .tr-neo .n-ch h3{ font-size:14px; }
.tr-app .tr-neo .n-ch .n-meta{ font-size:11.5px; }
.tr-app .tr-neo .n-inc-big{ font-size:24px; }
.tr-app .tr-neo .n-inc-sub{ font-size:12px; }
.tr-app .tr-neo .n-range button{ font-size:11.5px; }
.tr-app .tr-neo .n-axis{ font-size:10.5px; }
.tr-app .tr-neo .n-seg label{ font-size:12px; }
.tr-app .tr-neo .n-seg .n-c{ font-size:10px; }
.tr-app .tr-neo .n-pan{ font-size:13.5px; }
.tr-app .tr-neo .n-dmeta{ font-size:11.5px; }
.tr-app .tr-neo .n-amt .a{ font-size:14px; }
.tr-app .tr-neo .n-amt .b{ font-size:11px; }
.tr-app .tr-neo .n-clk .t{ font-size:14px; }
.tr-app .tr-neo .n-boost h3{ font-size:14.5px; }
.tr-app .tr-neo .n-boost p{ font-size:12px; }
.tr-app .tr-neo .n-boost-btn{ font-size:13px; }
.tr-app .tr-neo .n-boost-meta{ font-size:11px; }
.tr-app .tr-neo .n-lg{ font-size:12px; }
.tr-app .tr-neo .n-qa a{ font-size:12px; }
.tr-app .tr-neo .n-empty{ font-size:12.5px; }
/* /типографика дашборда */

/* донат конверсии: подпись — HTML-оверлей, всегда по центру кольца */
.tr-app .tr-neo .n-donut{ position:relative; width:112px; height:112px; flex:none; }
.tr-app .tr-neo .n-donut svg{ display:block; }
.tr-app .tr-neo .n-donut-c{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; pointer-events:none;
}
.tr-app .tr-neo .n-donut-c b{ font-size:21px; font-weight:750; letter-spacing:-.02em; color:var(--tr-text); line-height:1; }
.tr-app .tr-neo .n-donut-c span{ font-size:10px; color:var(--tr-muted); margin-top:3px; }

/* рабочая область — чистая подложка: admin.css красит .tr-workspace
   слоёным градиентом (свинцовая полоса сверху + глоу) — в кабинете глушим */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-workspace{
  background:transparent !important;
  box-shadow:none !important;
}

/* icon-кнопки и баланс-чип — плоские поверхности:
   admin.css в светлой теме красит их глянцевым 3D-градиентом */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-icon-btn{
  background:var(--tr-surface) !important;
  border-color:var(--tr-line) !important;
  box-shadow:0 1px 2px rgba(22,27,43,.04) !important;
  color:var(--tr-muted) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-icon-btn:hover{
  background:var(--tr-surface-2) !important;
  border-color:var(--tr-line) !important;
  color:var(--tr-text) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-chip{
  background:var(--tr-surface) !important;
  border-color:var(--tr-line) !important;
  box-shadow:0 1px 2px rgba(22,27,43,.04) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-balance-wrap.open .tr-balance-chip{
  background:var(--tr-surface-2) !important;
  border-color:var(--tr-purple) !important;
}

/* кнопка «Выйти» — компактная (обёртку-карточку убираем совсем) */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .tr-profile{
  padding:0;
  margin:6px 10px 10px;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html[data-app-scope="trader"] body.tr-app .tr-logout-btn{
  min-height:0 !important;
  height:26px !important;
  padding:0 10px !important;
  font-size:.72rem !important;
  border-radius:8px !important;
}

/* карточка «Доход»: переключатель PayIn/PayOut (radio-CSS, как в «Активных заявках») */
.tr-app .tr-neo .n-income input{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.tr-app .tr-neo .n-inc-view-out{ display:none; }
.tr-app .tr-neo #neo-inc-out:checked ~ .n-inc-view-in{ display:none; }
.tr-app .tr-neo #neo-inc-out:checked ~ .n-inc-view-out{ display:block; }
.tr-app .tr-neo #neo-inc-in:checked ~ .n-ch .lbl-inc-in,
.tr-app .tr-neo #neo-inc-out:checked ~ .n-ch .lbl-inc-out{
  background:var(--tr-surface);
  color:var(--tr-text);
  box-shadow:var(--n-sh);
}
.tr-app .tr-neo .n-inc-view .n-axis{ padding-bottom:16px; }

/* ==================================================================
   PayIn — вариант C: без верхних плашек, счётчики-пилюли в шапке
   панели; необанк-кожа таблицы (структура 1:1).
   ================================================================== */
html[data-app-scope="trader"] body.tr-app{
  --nb-green:#12a06a;  --nb-green-2:#e5f6ee;
  --nb-amber:#e0900c;  --nb-amber-2:#fbf1dd;
  --nb-red:#e5484d;    --nb-red-2:#fdebec;
  --nb-violet:#7b5cf0; --nb-violet-2:#f0ecff;
}
html[data-app-scope="trader"] body.tr-app[data-theme="dark"]{
  --nb-green:#2ee6a0;  --nb-green-2:rgba(46,230,160,.14);
  --nb-amber:#ffb24d;  --nb-amber-2:rgba(255,178,77,.14);
  --nb-red:#ff6b74;    --nb-red-2:rgba(255,107,116,.14);
  --nb-violet:#5b9dff; --nb-violet-2:rgba(91,157,255,.16);
}

/* Тема «Графит»: синие акценты вместо фиолетовых хардкодов — только тёмная, светлую не трогаем. */
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .payin-kpi.purple .payin-kpi-icon{ background:rgba(91,157,255,.16); color:#7ab0ff; }
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .status.payin-dir{ background:rgba(91,157,255,.15); color:#7ab0ff; }
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .tr-dash-table-link{ color:#7ab0ff; }
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .tr-side-link.active{ background:linear-gradient(100deg, rgba(91,157,255,.18), rgba(59,130,246,.06)) !important; color:var(--tr-text); border-top-color:rgba(91,157,255,.35) !important; }
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .tr-dash-bar{ background:linear-gradient(180deg,#7ab0ff,#3b82f6) !important; }
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .payout-pool-table td.payout-actions .payout-actions-inner button.payout-claim-btn,
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .payout-pool-table .payout-claim-btn:hover{ background:linear-gradient(135deg,#5b9dff 0%,#2563eb 100%); border-color:#5b9dff; }

/* шапки таблиц: near-black (rgba(5,5,8)/rgba(12,12,18)) из старой темы → графит.
   Только тёмная; перебиваем генерик .tr-app table th и sticky thead админки. */
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] table th,
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .payin-orders-table th,
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .table-wrap thead th,
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .payin-table-wrap .table-wrap thead th{
  background:rgba(31,36,46,.97) !important;
}

/* шапка панели: заголовок + пилюли */
html[data-app-scope="trader"] body.tr-app .payin-panel-head{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:14px 16px 0;
}
html[data-app-scope="trader"] body.tr-app .payin-panel-head .payin-panel-title{
  padding:0; margin:0;
}
html[data-app-scope="trader"] body.tr-app .payin-head-stats{
  display:inline-flex; gap:6px; margin-left:auto; flex-wrap:wrap;
}
html[data-app-scope="trader"] body.tr-app .phs{
  display:inline-flex; align-items:center; gap:5px;
  font-size:.66rem; font-weight:700; padding:3px 9px; border-radius:999px;
  white-space:nowrap;
}
html[data-app-scope="trader"] body.tr-app .phs b{ font-weight:800; font-variant-numeric:tabular-nums; }
html[data-app-scope="trader"] body.tr-app .phs--t{ background:var(--tr-purple-soft); color:var(--tr-purple); }
html[data-app-scope="trader"] body.tr-app .phs--g{ background:var(--nb-green-2); color:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .phs--o{ background:var(--nb-amber-2); color:var(--nb-amber); }
html[data-app-scope="trader"] body.tr-app .phs--r{ background:var(--nb-red-2); color:var(--nb-red); }
html[data-app-scope="trader"] body.tr-app .phs--v{ background:var(--tr-surface-2); color:var(--tr-text); }

/* вкладки Активные/Архив — сегмент на подложке */
html[data-app-scope="trader"] body.tr-app .payin-filter-tabs{
  background:var(--tr-surface-2) !important;
  border:0 !important;
  border-radius:10px !important;
  padding:3px !important;
  display:inline-flex; gap:2px;
}
html[data-app-scope="trader"] body.tr-app .payin-filter-tab{
  border:0 !important;
  background:transparent !important;
  color:var(--tr-muted) !important;
  font-size:.72rem !important;
  font-weight:700 !important;
  padding:6px 12px !important;
  border-radius:8px !important;
  box-shadow:none !important;
}
html[data-app-scope="trader"] body.tr-app .payin-filter-tab.active{
  background:var(--tr-surface) !important;
  color:var(--tr-text) !important;
  box-shadow:0 1px 2px rgba(22,27,43,.08) !important;
}
html[data-app-scope="trader"] body.tr-app .payin-filter-tab .payin-filter-count{
  background:var(--tr-line) !important;
  color:var(--tr-muted) !important;
  border-radius:6px !important;
  padding:1px 6px !important;
  font-size:.6rem !important;
  font-weight:800 !important;
}
html[data-app-scope="trader"] body.tr-app .payin-filter-tab.active .payin-filter-count{
  background:var(--tr-purple) !important;
  color:#fff !important;
}

/* поиск и кнопка фильтра */
html[data-app-scope="trader"] body.tr-app .payin-search{
  background:var(--tr-surface-2) !important;
  border:1px solid transparent !important;
  border-radius:9px !important;
  height:32px !important;
  font-size:.75rem !important;
}
html[data-app-scope="trader"] body.tr-app .payin-search:focus{
  border-color:var(--tr-purple) !important;
  background:var(--tr-surface) !important;
}
html[data-app-scope="trader"] body.tr-app #payin-filter-btn{
  display:inline-flex; align-items:center; gap:6px;
  height:32px; border-radius:9px !important;
  font-size:.72rem !important; font-weight:600;
}
html[data-app-scope="trader"] body.tr-app .payin-view-toggle{
  border:1px solid var(--tr-line) !important;
  border-radius:9px !important;
  overflow:hidden;
}
html[data-app-scope="trader"] body.tr-app .payin-view-btn{
  width:30px; height:30px;
  display:inline-grid; place-items:center;
  border:0 !important; border-radius:0 !important;
  background:transparent !important;
  color:var(--tr-muted) !important;
}
html[data-app-scope="trader"] body.tr-app .payin-view-btn.active{
  background:var(--tr-purple-soft) !important;
  color:var(--tr-purple) !important;
}

/* дедлайн — чип-таймер (зелёный → красный при истечении) */
html[data-app-scope="trader"] body.tr-app td .payin-expiry{
  display:inline-flex; align-items:center; gap:5px;
  font-size:.7rem; font-weight:750; font-variant-numeric:tabular-nums;
  padding:2px 8px; border-radius:7px;
  background:var(--nb-green-2); color:var(--nb-green);
}
html[data-app-scope="trader"] body.tr-app td .payin-expiry--soon{
  background:var(--nb-red-2) !important;
  color:var(--nb-red) !important;
}

/* статусы — пилюли необанка (вся таблица кабинета) */
html[data-app-scope="trader"] body.tr-app .status{
  font-size:.66rem !important;
  font-weight:700 !important;
  padding:3px 9px !important;
  border-radius:999px !important;
  border:0 !important;
}
html[data-app-scope="trader"] body.tr-app .status.waiting-payment{ background:var(--tr-purple-soft) !important; color:var(--tr-purple) !important; }
html[data-app-scope="trader"] body.tr-app .status.under-review{ background:var(--nb-amber-2) !important; color:var(--nb-amber) !important; }
html[data-app-scope="trader"] body.tr-app .status.paid{ background:var(--nb-green-2) !important; color:var(--nb-green) !important; }
html[data-app-scope="trader"] body.tr-app .status.expired{ background:var(--nb-red-2) !important; color:var(--nb-red) !important; }
html[data-app-scope="trader"] body.tr-app .status.az-test{ background:var(--nb-violet-2) !important; color:var(--nb-violet) !important; }
/* активный спор: заявка заморожена до решения по апелляции */
html[data-app-scope="trader"] body.tr-app .status.disputed{ background:var(--nb-violet-2) !important; color:var(--nb-violet) !important; }

/* кнопка подтверждения в строке — банкнота+галочка */
html[data-app-scope="trader"] body.tr-app .payin-confirm-btn{
  width:30px !important; height:26px !important;
  min-height:0 !important; padding:0 !important;
  display:inline-grid; place-items:center;
  border-radius:8px !important;
  border:1px solid rgba(18,160,106,.4) !important;
  background:var(--nb-green-2) !important;
  color:var(--nb-green) !important;
  box-shadow:none !important;
}
html[data-app-scope="trader"] body.tr-app .payin-confirm-btn:hover{
  border-color:var(--nb-green) !important;
  background:var(--nb-green-2) !important;
  filter:brightness(1.04);
}
html[data-app-scope="trader"] body.tr-app .payin-confirm-btn svg{ width:15px; height:15px; }

/* иконка в кнопке дровера подтверждения */
html[data-app-scope="trader"] body.tr-app .payin-confirm-ic{
  display:inline-grid; place-items:center; margin-right:7px; vertical-align:-3px;
}
html[data-app-scope="trader"] body.tr-app .payin-confirm-ic svg{ width:14px; height:14px; }

/* таблица: табличные цифры */
html[data-app-scope="trader"] body.tr-app .payin-orders-table{ font-variant-numeric:tabular-nums; }
/* /PayIn вариант C */

/* --- PayIn: панель-карточка, белые строки, sans-шрифт (как в концепте C) --- */
html[data-app-scope="trader"] body.tr-app{ --nb-rowhover:rgba(61,84,224,.05); }
html[data-app-scope="trader"] body.tr-app[data-theme="dark"]{ --nb-rowhover:rgba(91, 157, 246,.09); }

/* панель — белая карточка */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-panel{
  background:var(--tr-surface) !important;
  border:1px solid var(--tr-line) !important;
  border-radius:14px !important;
  box-shadow:0 1px 2px rgba(22,27,43,.04), 0 10px 26px -14px rgba(30,40,90,.12) !important;
}

/* шрифт таблицы — системный sans (моно остаётся только у ID и карты через .mono) */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table,
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table th{
  font-family:var(--font-sans) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-amount{
  font-family:var(--font-sans) !important;
  font-weight:750;
  letter-spacing:-.01em;
}

/* строки — прозрачные на белой панели, разделители токеном, без зебры */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-table-wrap tbody tr,
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-table-wrap tbody tr:nth-child(even) td,
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-table-wrap td{
  background:transparent !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-table-wrap td{
  border-bottom:1px solid var(--tr-line) !important;
  color:var(--tr-text) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-table-wrap tbody tr:hover td{
  background:var(--nb-rowhover) !important;
}

/* шапка таблицы — светлая подложка в обеих темах */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table th{
  background:var(--tr-surface-2) !important;
  color:var(--tr-muted) !important;
  box-shadow:0 1px 0 var(--tr-line) !important;
}
/* /PayIn кожа таблицы */

/* внутренний .table-wrap (хелпер table()) — admin.css в светлой теме даёт ему
   3D-градиент; в кабинете таблицы лежат на белой панели — фон не нужен */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .table-wrap{
  background:transparent !important;
  box-shadow:none !important;
  border-color:var(--tr-line) !important;
}

/* реквизит (номер карты + имя) — тот же sans, что и вся таблица */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table td:nth-child(5) .mono,
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table td:nth-child(5) .payin-beneficiary{
  font-family:var(--font-sans) !important;
  font-variant-numeric:tabular-nums;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table td:nth-child(5) .mono{
  font-weight:650;
  font-size:12px !important;
}

/* ID — усечение с многоточием, чтобы колонки заполнялись равномерно */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table .payin-req-id.op-copy-id{
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  display:block;
}

/* дедлайн: отступ от кнопки подтверждения + иконка часов в чипе */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table td:nth-child(6),
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table th:nth-child(6){
  text-align:left !important;
  padding-right:18px !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table td:nth-child(6) .payin-expiry::before{
  content:"";
  width:11px; height:11px;
  flex:none;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* --- PayIn: порядок колонок Дата·ID·Сумма·Реквизит·Статус·Дедлайн ---
   (payout-таблица делит класс payin-orders-table и сохраняет старый
   порядок — поэтому правки только через :not(.payout-orders-table)) */

/* Сумма теперь 3-я колонка: базовый стиль центрировал её (там был статус) */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) th:nth-child(3),
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) td:nth-child(3){
  text-align:left !important;
}

/* Реквизит теперь 4-я колонка: sans-шрифт + усечение (перенос правил с 5-й) */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) td:nth-child(4) .mono,
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) td:nth-child(4) .payin-beneficiary{
  font-family:var(--font-sans) !important;
  font-variant-numeric:tabular-nums;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  display:block;
  max-width:100%;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) td:nth-child(4) .mono{
  font-weight:650;
  font-size:12px !important;
}

/* жёсткие ширины колонок PayIn (CSS с !important перебивает inline colgroup
   и content-based распределение fixed-layout на любых экранах) */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table){
  table-layout:fixed !important;
  width:100% !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) col:nth-child(1){ width:11% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) col:nth-child(2){ width:33% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) col:nth-child(3){ width:14% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) col:nth-child(4){ width:20% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) col:nth-child(5){ width:9% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) col:nth-child(6){ width:9% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) col:nth-child(7){ width:4% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) th:nth-child(1){ width:11% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) th:nth-child(2){ width:33% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) th:nth-child(3){ width:14% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) th:nth-child(4){ width:20% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) th:nth-child(5){ width:9% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) th:nth-child(6){ width:9% !important; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-orders-table:not(.payout-orders-table) th:nth-child(7){ width:4% !important; min-width:44px !important; }

/* --- футер таблицы PayIn: без фона, 3D-кнопки страниц --- */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-table-footer{
  background:transparent !important;
  border-top:1px solid var(--tr-line) !important;
  box-shadow:none !important;
  padding:10px 14px !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-footer-spacer{ flex:1; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-total-count{ flex:1; text-align:right; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-pagination{ display:flex; gap:6px; }

/* 3D-кнопки переключения страниц */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-page-btn{
  min-width:30px !important;
  height:30px !important;
  min-height:0 !important;
  padding:0 9px !important;
  border-radius:9px !important;
  font-size:.75rem !important;
  font-weight:700 !important;
  color:var(--tr-text) !important;
  background:linear-gradient(180deg,#ffffff,#eef1f8) !important;
  border:1px solid var(--tr-line) !important;
  box-shadow:0 2px 0 rgba(22,27,43,.08), 0 3px 6px -2px rgba(30,40,90,.18) !important;
  transition:transform .1s ease, box-shadow .1s ease;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-page-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 3px 0 rgba(22,27,43,.08), 0 5px 10px -3px rgba(30,40,90,.22) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-page-btn:active{
  transform:translateY(1px);
  box-shadow:0 0 0 rgba(0,0,0,0), inset 0 2px 3px rgba(22,27,43,.14) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payin-page-btn.active{
  color:#fff !important;
  background:linear-gradient(180deg,#5468ff,#3d54e0) !important;
  border-color:#3345c4 !important;
  box-shadow:0 2px 0 #2a3aa8, 0 4px 10px -2px rgba(61,84,224,.5) !important;
}
/* тёмная тема: объём на тёмных поверхностях */
html[data-app-scope="trader"] body.tr-app[data-theme="dark"].tr-app--admin .payin-page-btn{
  background:linear-gradient(180deg,var(--tr-surface-2),var(--tr-surface)) !important;
  color:var(--tr-text) !important;
  box-shadow:0 2px 0 rgba(0,0,0,.5), 0 3px 6px -2px rgba(0,0,0,.6) !important;
}

/* ==================================================================
   PayOut — концепт V2: фиолетовая шапка стакана, кнопка «Забрать» B1,
   иконки-действия в «Моих выплатах». Структура таблиц не тронута.
   ================================================================== */

/* шапка стакана — фиолетовый градиент */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-pool-panel{ overflow:hidden; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-pool-head{
  background:linear-gradient(135deg,var(--nb-violet-2),var(--tr-purple-soft));
  border-bottom:1px solid var(--tr-line);
  padding:13px 16px 11px;
  margin:0 0 10px;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-pool-title{
  display:flex; align-items:center; gap:8px;
  color:var(--nb-violet) !important;
  padding:0 !important; margin:0 !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-pool-ic{ display:inline-grid; place-items:center; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-pool-ic svg{ width:14px; height:14px; }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-pool-title .payin-filter-count{
  background:var(--nb-violet) !important;
  color:#fff !important;
  border-radius:6px !important;
  padding:1px 7px !important;
  font-size:.62rem !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-pool-hint{
  margin:4px 0 0;
  font-size:.72rem;
  color:var(--tr-muted);
}

/* кнопка «Забрать» — B1: фиолетовая 3D с молнией */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-claim-btn{
  display:inline-flex; align-items:center; gap:6px;
  min-height:0 !important;
  padding:7px 12px !important;
  border:0 !important;
  border-radius:9px !important;
  font-size:.72rem !important;
  font-weight:700 !important;
  color:#fff !important;
  background:linear-gradient(180deg,#8b7bff,#5b9dff) !important;
  box-shadow:0 2px 0 #5d3fd4, 0 4px 10px -2px rgba(59, 130, 246,.45) !important;
  transition:transform .1s ease, box-shadow .1s ease;
  white-space:nowrap;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-claim-btn:hover{
  transform:translateY(-1px);
  background:linear-gradient(180deg,#978aff,#7a69f6) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-claim-btn:active{
  transform:translateY(1px);
  box-shadow:0 0 0 rgba(0,0,0,0), inset 0 2px 3px rgba(0,0,0,.2) !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-claim-btn svg{ width:13px; height:13px; }

/* действия «Моих выплат» — компактные иконки-кнопки */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-actions-inner{
  display:inline-flex !important;
  flex-direction:row !important;
  gap:6px !important;
  align-items:center !important;
  width:auto !important;
  min-width:0 !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-close-btn,
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-release-btn{
  width:30px !important; height:28px !important;
  min-height:0 !important; padding:0 !important;
  display:inline-grid; place-items:center;
  border-radius:9px !important;
  transition:transform .1s ease;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-close-btn:hover,
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-release-btn:hover{ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-close-btn{
  border:1px solid rgba(18,160,106,.4) !important;
  background:var(--nb-green-2) !important;
  color:var(--nb-green) !important;
  box-shadow:none !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-release-btn{
  border:1px solid rgba(123,92,240,.4) !important;
  background:var(--nb-violet-2) !important;
  color:var(--nb-violet) !important;
  box-shadow:none !important;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-close-btn svg,
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-release-btn svg{ width:14px; height:14px; }

/* статус «в работе» — индиго-пилюля */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .status.in-work{
  background:var(--tr-purple-soft) !important;
  color:var(--tr-purple) !important;
}

/* 3D-кнопки страниц PayOut (как в PayIn) */
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-page-btn{
  min-width:30px !important; height:30px !important; min-height:0 !important;
  padding:0 9px !important; border-radius:9px !important;
  font-size:.75rem !important; font-weight:700 !important;
  color:var(--tr-text) !important;
  background:linear-gradient(180deg,#ffffff,#eef1f8) !important;
  border:1px solid var(--tr-line) !important;
  box-shadow:0 2px 0 rgba(22,27,43,.08), 0 3px 6px -2px rgba(30,40,90,.18) !important;
  transition:transform .1s ease, box-shadow .1s ease;
}
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-page-btn:hover{ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-page-btn:active{ transform:translateY(1px); }
html[data-app-scope="trader"] body.tr-app.tr-app--admin .payout-page-btn.active{
  color:#fff !important;
  background:linear-gradient(180deg,#5468ff,#3d54e0) !important;
  border-color:#2a3aa8 !important;
  box-shadow:0 2px 0 #2a3aa8, 0 4px 10px -2px rgba(61,84,224,.5) !important;
}
html[data-app-scope="trader"] body.tr-app[data-theme="dark"].tr-app--admin .payout-page-btn{
  background:linear-gradient(180deg,var(--tr-surface-2),var(--tr-surface)) !important;
  box-shadow:0 2px 0 rgba(0,0,0,.5), 0 3px 6px -2px rgba(0,0,0,.6) !important;
}
/* /PayOut V2 */

/* ==================================================================
   Дровер закрытия выплаты (концепт U1): сумма-герой, копи-факты,
   дроп-зона, файлы-карточки, зелёная 3D-отправка.
   ================================================================== */
html[data-app-scope="trader"] body.tr-app .po-close{ display:flex; flex-direction:column; gap:13px; }

/* сумма-герой */
html[data-app-scope="trader"] body.tr-app .po-amount{
  display:flex; align-items:center; gap:10px;
  background:linear-gradient(135deg,var(--nb-violet-2),var(--tr-purple-soft));
  border:1px solid var(--tr-line);
  border-radius:13px; padding:12px 14px;
}
html[data-app-scope="trader"] body.tr-app .po-amount-l{
  font-size:.6rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--nb-violet);
}
html[data-app-scope="trader"] body.tr-app .po-amount-v{
  font-size:1.4rem; font-weight:750; letter-spacing:-.02em; margin-top:1px; color:var(--tr-text);
}
html[data-app-scope="trader"] body.tr-app .po-copy{
  margin-left:auto; display:inline-flex; align-items:center; gap:6px;
  height:30px; padding:0 11px; border-radius:9px;
  border:1px solid var(--tr-line); background:var(--tr-surface);
  font-size:.68rem; font-weight:700; color:var(--tr-text); cursor:pointer;
}
html[data-app-scope="trader"] body.tr-app .po-copy:hover{ border-color:var(--tr-purple); }

/* реквизит / получатель — копи-карточки */
html[data-app-scope="trader"] body.tr-app .po-facts{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
html[data-app-scope="trader"] body.tr-app .po-fact{
  display:flex; align-items:center; gap:8px; text-align:left;
  border:1px solid var(--tr-line); border-radius:11px; padding:9px 11px;
  background:var(--tr-surface); cursor:pointer; font:inherit; color:var(--tr-text); min-width:0;
}
html[data-app-scope="trader"] body.tr-app .po-fact:hover{ border-color:var(--tr-purple); }
html[data-app-scope="trader"] body.tr-app .po-fact > span:first-child{ min-width:0; flex:1; display:block; }
html[data-app-scope="trader"] body.tr-app .po-fact-l{
  display:block; font-size:.55rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .po-fact-v{
  display:block; font-size:.72rem; font-weight:700; margin-top:1px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
html[data-app-scope="trader"] body.tr-app .po-fact svg{ color:var(--tr-muted); flex:none; }

/* дроп-зона */
html[data-app-scope="trader"] body.tr-app .po-drop{
  display:flex; flex-direction:column; align-items:center; gap:5px;
  border:1.5px dashed var(--tr-line); border-radius:14px;
  background:var(--tr-surface-2); padding:20px 16px; text-align:center; cursor:pointer;
  transition:border-color .15s, background .15s;
}
html[data-app-scope="trader"] body.tr-app .po-drop:hover,
html[data-app-scope="trader"] body.tr-app .po-drop.is-over{
  border-color:var(--nb-green); background:var(--nb-green-2);
}
html[data-app-scope="trader"] body.tr-app .po-drop-ic{
  width:42px; height:42px; margin-bottom:3px; border-radius:12px;
  display:grid; place-items:center;
  background:var(--tr-surface); color:var(--nb-green);
  border:1px solid var(--tr-line); box-shadow:0 2px 6px rgba(22,27,43,.06);
}
html[data-app-scope="trader"] body.tr-app .po-drop-ic svg{ width:19px; height:19px; }
html[data-app-scope="trader"] body.tr-app .po-drop-t{ font-size:.78rem; font-weight:700; color:var(--tr-text); }
html[data-app-scope="trader"] body.tr-app .po-drop-t b{ color:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .po-drop-h{ font-size:.62rem; color:var(--tr-muted); }

/* выбранные файлы */
html[data-app-scope="trader"] body.tr-app .po-files{ display:flex; flex-direction:column; gap:7px; }
html[data-app-scope="trader"] body.tr-app .po-file{
  display:flex; align-items:center; gap:10px;
  border:1px solid var(--tr-line); border-radius:11px; padding:8px 10px; background:var(--tr-surface);
}
html[data-app-scope="trader"] body.tr-app .po-file-th{
  width:34px; height:34px; border-radius:8px; flex:none;
  display:grid; place-items:center; background:var(--nb-green-2); color:var(--nb-green);
}
html[data-app-scope="trader"] body.tr-app .po-file-th.pdf{ background:var(--nb-red-2); color:var(--nb-red); }
html[data-app-scope="trader"] body.tr-app .po-file-th svg{ width:16px; height:16px; }
html[data-app-scope="trader"] body.tr-app .po-file-info{ min-width:0; flex:1; }
html[data-app-scope="trader"] body.tr-app .po-file-n{
  display:block; font-size:.72rem; font-weight:700; color:var(--tr-text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
html[data-app-scope="trader"] body.tr-app .po-file-s{ display:block; font-size:.6rem; color:var(--tr-muted); margin-top:1px; }
html[data-app-scope="trader"] body.tr-app .po-file-ok{ color:var(--nb-green); display:inline-flex; }
html[data-app-scope="trader"] body.tr-app .po-file-rm{
  width:24px; height:24px; border-radius:7px; border:0;
  display:grid; place-items:center; background:var(--tr-surface-2); color:var(--tr-muted);
  cursor:pointer; font-size:.65rem;
}
html[data-app-scope="trader"] body.tr-app .po-file-rm:hover{ color:var(--nb-red); background:var(--nb-red-2); }
html[data-app-scope="trader"] body.tr-app .po-addmore{
  align-self:flex-start; border:0; background:transparent; cursor:pointer;
  font:inherit; font-size:.7rem; font-weight:700; color:var(--tr-purple); padding:2px;
}

/* зелёная 3D-кнопка отправки */
html[data-app-scope="trader"] body.tr-app .po-go{
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  border:0 !important; border-radius:11px !important;
  padding:11px 14px !important;
  font-size:.8rem !important; font-weight:700 !important; color:#fff !important;
  background:linear-gradient(180deg,#17b877,#0d9862) !important;
  box-shadow:0 2px 0 #0d7a51, 0 6px 14px -4px rgba(18,160,106,.45) !important;
  transition:transform .1s ease, opacity .15s ease;
}
html[data-app-scope="trader"] body.tr-app .po-go:hover:not(:disabled){ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app .po-go:active:not(:disabled){ transform:translateY(1px); }
html[data-app-scope="trader"] body.tr-app .po-go:disabled{ opacity:.55; box-shadow:none !important; cursor:default; }
/* /дровер закрытия выплаты */

/* --- дровер кабинета: белая карточка, ровное скругление всех углов --- */
html[data-app-scope="trader"] body.tr-app .drawer{
  background:var(--tr-surface) !important;
  border:1px solid var(--tr-line) !important;
}
html[data-app-scope="trader"] body.tr-app .drawer.centered{
  border-radius:18px !important;
  overflow:hidden !important; /* шапка со своим фоном вылезала за скругление — верх выглядел квадратным */
  box-shadow:0 2px 8px rgba(22,27,43,.07), 0 32px 70px -28px rgba(30,40,90,.5) !important;
}
html[data-app-scope="trader"] body.tr-app .drawer .drawer-head{
  background:transparent !important;
  border-bottom:1px solid var(--tr-line) !important;
}
html[data-app-scope="trader"] body.tr-app .drawer .drawer-close{
  width:30px; height:30px;
  border-radius:10px !important;
  border:1px solid var(--tr-line) !important;
  background:var(--tr-surface-2) !important;
  color:var(--tr-muted) !important;
}
html[data-app-scope="trader"] body.tr-app .drawer .drawer-close:hover{ color:var(--tr-text) !important; }
html[data-app-scope="trader"] body.tr-app .drawer-overlay{
  background:rgba(22,27,43,.45) !important;
  -webkit-backdrop-filter:blur(2px);
  backdrop-filter:blur(2px);
}

/* ==================================================================
   Реквизиты — концепт R3 «строки-карточки»: банк-иконка, лимиты с
   прогресс-барами, статус/АЗ и управление справа.
   ================================================================== */
html[data-app-scope="trader"] body.tr-app .rq-top{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px;
}
html[data-app-scope="trader"] body.tr-app .rq-fee{
  display:inline-flex; align-items:center; height:32px; padding:0 12px;
  border-radius:10px; background:var(--tr-purple-soft); color:var(--tr-purple);
  font-size:.72rem; font-weight:700;
}
html[data-app-scope="trader"] body.tr-app .rq-cnt{
  display:inline-flex; align-items:center; gap:5px; height:32px; padding:0 11px;
  border-radius:10px; background:var(--tr-surface); border:1px solid var(--tr-line);
  font-size:.68rem; font-weight:700; color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .rq-cnt b{ color:var(--tr-text); }
html[data-app-scope="trader"] body.tr-app .rq-cnt--g{ color:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .rq-cnt--g b{ color:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .rq-add{
  margin-left:auto; display:inline-flex; align-items:center; gap:6px;
  border:0 !important; cursor:pointer; font-size:.72rem !important; font-weight:700 !important;
  color:#fff !important; padding:8px 14px !important; min-height:0 !important; border-radius:10px !important;
  background:linear-gradient(180deg,#5468ff,#3d54e0) !important;
  box-shadow:0 2px 0 #2a3aa8, 0 4px 10px -2px rgba(61,84,224,.45) !important;
  transition:transform .1s ease;
}
html[data-app-scope="trader"] body.tr-app .rq-add:hover{ transform:translateY(-1px); }

/* поиск по реквизитам */
html[data-app-scope="trader"] body.tr-app .rq-search{
  position:relative; display:flex; align-items:center;
  flex:1 1 220px; min-width:170px; max-width:340px;
}
html[data-app-scope="trader"] body.tr-app .rq-search-ic{
  position:absolute; left:11px; color:var(--tr-muted); pointer-events:none;
}
html[data-app-scope="trader"] body.tr-app .rq-search-input{
  width:100%; height:32px; padding:0 12px 0 32px; box-sizing:border-box;
  border-radius:10px; border:1px solid var(--tr-line); background:var(--tr-surface);
  color:var(--tr-text); font-size:.72rem; font-weight:600; outline:none;
  transition:border-color .12s ease, box-shadow .12s ease;
}
html[data-app-scope="trader"] body.tr-app .rq-search-input::placeholder{ color:var(--tr-muted); font-weight:500; }
html[data-app-scope="trader"] body.tr-app .rq-search-input:focus{
  border-color:var(--tr-purple); box-shadow:0 0 0 3px var(--tr-purple-soft);
}
html[data-app-scope="trader"] body.tr-app .rq-search-input::-webkit-search-cancel-button{ cursor:pointer; }

html[data-app-scope="trader"] body.tr-app .rq-rows{ display:flex; flex-direction:column; gap:9px; }
html[data-app-scope="trader"] body.tr-app .rq-empty{
  padding:34px; text-align:center; color:var(--tr-muted); font-size:.8rem;
  background:var(--tr-surface); border:1px solid var(--tr-line); border-radius:13px;
}
html[data-app-scope="trader"] body.tr-app .rq-row{
  display:flex; align-items:center; gap:14px;
  background:var(--tr-surface); border:1px solid var(--tr-line); border-radius:13px;
  padding:11px 14px;
  box-shadow:0 1px 2px rgba(22,27,43,.04);
}
html[data-app-scope="trader"] body.tr-app .rq-row--off{ opacity:.72; }

html[data-app-scope="trader"] body.tr-app .rq-id{ display:flex; align-items:center; gap:10px; width:215px; flex:none; min-width:0; }
html[data-app-scope="trader"] body.tr-app .rq-bank{
  width:32px; height:32px; border-radius:9px; flex:none;
  display:grid; place-items:center; font-size:.62rem; font-weight:800; color:#fff;
}
html[data-app-scope="trader"] body.tr-app .rq-bank--0{ background:linear-gradient(135deg,#5468ff,#3345c4); }
html[data-app-scope="trader"] body.tr-app .rq-bank--1{ background:linear-gradient(135deg,#161b2b,#3a4157); }
html[data-app-scope="trader"] body.tr-app .rq-bank--2{ background:linear-gradient(135deg,#17b877,#0d7a51); }
html[data-app-scope="trader"] body.tr-app .rq-bank--3{ background:linear-gradient(135deg,#8b7bff,#5d3fd4); }
html[data-app-scope="trader"] body.tr-app .rq-id-txt{ min-width:0; }
html[data-app-scope="trader"] body.tr-app .rq-card{
  font-size:.78rem; font-weight:750; letter-spacing:.02em; color:var(--tr-text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
html[data-app-scope="trader"] body.tr-app .rq-own{
  font-size:.62rem; color:var(--tr-muted); margin-top:1px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

html[data-app-scope="trader"] body.tr-app .rq-lims{ display:flex; gap:14px; flex:1; min-width:0; flex-wrap:nowrap; }
html[data-app-scope="trader"] body.tr-app .rq-lim{ display:flex; flex-direction:column; gap:4px; flex:1; min-width:0; }
html[data-app-scope="trader"] body.tr-app .rq-lb{
  font-size:.55rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--tr-muted); opacity:.8;
}
html[data-app-scope="trader"] body.tr-app .rq-vv{ font-size:.64rem; color:var(--tr-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html[data-app-scope="trader"] body.tr-app .rq-vv b{ color:var(--tr-text); font-weight:700; }
html[data-app-scope="trader"] body.tr-app .rq-bar{
  height:5px; border-radius:3px; background:var(--tr-surface-2); overflow:hidden; min-width:0;
}
html[data-app-scope="trader"] body.tr-app .rq-bar i{
  display:block; height:100%; border-radius:3px; background:var(--tr-purple);
}
html[data-app-scope="trader"] body.tr-app .rq-bar i.warn{ background:var(--nb-amber); }

html[data-app-scope="trader"] body.tr-app .rq-state{ display:inline-flex; align-items:center; gap:7px; flex:none; }
html[data-app-scope="trader"] body.tr-app .rq-ctrl{ display:inline-flex; align-items:center; gap:8px; flex:none; }
html[data-app-scope="trader"] body.tr-app .rq-gear{
  width:28px !important; height:28px !important; min-height:0 !important; padding:0 !important;
  border-radius:9px !important; border:1px solid var(--tr-line) !important;
  background:var(--tr-surface) !important; color:var(--tr-muted) !important;
  display:inline-grid; place-items:center;
}
html[data-app-scope="trader"] body.tr-app .rq-gear:hover{ color:var(--tr-purple) !important; border-color:var(--tr-purple) !important; }

@media (max-width: 1280px){
  html[data-app-scope="trader"] body.tr-app .rq-row{ flex-wrap:wrap; }
  html[data-app-scope="trader"] body.tr-app .rq-lims{ order:3; flex:0 0 100%; width:100%; }
  html[data-app-scope="trader"] body.tr-app .rq-state{ margin-left:auto; }
}
/* /Реквизиты R3 */

/* фирменные иконки банков (упрощённые брендовые цвета/глифы) */
html[data-app-scope="trader"] body.tr-app .rq-bank svg{ width:17px; height:17px; display:block; }
html[data-app-scope="trader"] body.tr-app .rq-bank--privat{ background:linear-gradient(135deg,#8dc63f,#5aa021); }
html[data-app-scope="trader"] body.tr-app .rq-bank--mono{ background:linear-gradient(135deg,#2b2b33,#111116); color:#ffd83d; }
html[data-app-scope="trader"] body.tr-app .rq-bank--oschad{ background:linear-gradient(135deg,#1aa25a,#0d7a3f); }
html[data-app-scope="trader"] body.tr-app .rq-bank--pumb{ background:linear-gradient(135deg,#e03a3f 0 49%,#1d4fa8 51% 100%); }
html[data-app-scope="trader"] body.tr-app .rq-bank--raif{ background:linear-gradient(135deg,#ffe94d,#ffd400); color:#161b2b; }
html[data-app-scope="trader"] body.tr-app .rq-bank--ukrsib{ background:linear-gradient(135deg,#12a99b,#0a6e64); }
html[data-app-scope="trader"] body.tr-app .rq-bank--abank{ background:linear-gradient(135deg,#ff4d4d,#d61f2c); text-transform:lowercase; }
html[data-app-scope="trader"] body.tr-app .rq-bank--sense{ background:linear-gradient(135deg,#3a4157,#161b2b); }
html[data-app-scope="trader"] body.tr-app .rq-bank--ukrgas{ background:linear-gradient(135deg,#37a1e6,#1668ad); }
html[data-app-scope="trader"] body.tr-app .rq-bank--universal{ background:linear-gradient(135deg,#ff9f45,#e0700c); }
html[data-app-scope="trader"] body.tr-app .rq-bank--izi{ background:linear-gradient(135deg,#8b7bff,#5d3fd4); font-size:.5rem; text-transform:lowercase; }
html[data-app-scope="trader"] body.tr-app .rq-bank--kredo{ background:linear-gradient(135deg,#2f7de0,#1d4fa8); }
html[data-app-scope="trader"] body.tr-app .rq-bank--vostok{ background:linear-gradient(135deg,#ff8a3d,#e05a0c); }
html[data-app-scope="trader"] body.tr-app .rq-bank--alliance{ background:linear-gradient(135deg,#12a06a,#0d7a51); }
html[data-app-scope="trader"] body.tr-app .rq-bank--otp{ background:linear-gradient(135deg,#52ae30,#33701d); font-size:.5rem; text-transform:lowercase; }

/* селект банка в форме реквизита */
html[data-app-scope="trader"] body.tr-app #tr-req-bank{
  width:100%; height:38px; border-radius:10px;
  border:1px solid var(--tr-line); background:var(--tr-surface); color:var(--tr-text);
  padding:0 10px; font:inherit; font-size:.8rem;
}
html[data-app-scope="trader"] body.tr-app #tr-req-bank-custom{ width:100%; }

/* реальные логотипы банков: белая плитка + <img>-фавиконка;
   .is-fb — фолбэк на инициалы (ошибка сети/неизвестный банк) */
html[data-app-scope="trader"] body.tr-app .rq-bank--logo{
  background:#fff;
  border:1px solid var(--tr-line);
}
html[data-app-scope="trader"] body.tr-app .rq-bank--logo img{
  width:20px; height:20px; display:block; border-radius:4px;
}
html[data-app-scope="trader"] body.tr-app .rq-bank--logo .rq-bank-fb{ display:none; }
html[data-app-scope="trader"] body.tr-app .rq-bank--logo.is-fb{ border:0; }
html[data-app-scope="trader"] body.tr-app .rq-bank--logo.is-fb .rq-bank-fb{ display:block; }

/* --- индикаторы реквизита I2: единая капсула «статус | АЗ», настройки отдельно --- */
@keyframes rq-glow{
  0%,100%{ box-shadow:0 0 4px 1px rgba(18,160,106,.55); }
  50%{ box-shadow:0 0 9px 3px rgba(18,160,106,.75); }
}
html[data-app-scope="trader"] body.tr-app .rq-caps{
  display:inline-flex; align-items:center; height:30px; flex:none;
  border:1px solid var(--tr-line); border-radius:11px;
  background:var(--tr-surface); overflow:hidden;
  box-shadow:0 1px 2px rgba(22,27,43,.04);
}
html[data-app-scope="trader"] body.tr-app .rq-caps-st,
html[data-app-scope="trader"] body.tr-app .rq-caps-az{
  display:inline-flex; align-items:center; gap:6px; height:100%;
  padding:0 11px; font-size:.62rem; font-weight:800; letter-spacing:.04em;
  white-space:nowrap;
}
html[data-app-scope="trader"] body.tr-app .rq-caps-st .d{
  width:7px; height:7px; border-radius:50%; background:currentColor; flex:none;
}
html[data-app-scope="trader"] body.tr-app .rq-caps-st.on{
  color:var(--nb-green);
  background:linear-gradient(180deg,rgba(18,160,106,.1),rgba(18,160,106,.04));
}
html[data-app-scope="trader"] body.tr-app .rq-caps-st.on .d{ animation:rq-glow 2s infinite; }
html[data-app-scope="trader"] body.tr-app .rq-caps-st.test{
  color:var(--nb-amber);
  background:linear-gradient(180deg,rgba(224,144,12,.12),rgba(224,144,12,.04));
}
html[data-app-scope="trader"] body.tr-app .rq-caps-st.off{ color:var(--tr-muted); opacity:.8; }
html[data-app-scope="trader"] body.tr-app .rq-caps-az{
  border:0; border-left:1px solid var(--tr-line);
  background:transparent; cursor:pointer; font:inherit;
  font-size:.62rem; font-weight:800; letter-spacing:.04em;
}
html[data-app-scope="trader"] body.tr-app .rq-caps-az.on{ color:var(--tr-purple); }
html[data-app-scope="trader"] body.tr-app .rq-caps-az.off{ color:var(--tr-muted); opacity:.75; }
html[data-app-scope="trader"] body.tr-app .rq-caps-az:hover{ background:var(--tr-surface-2); }
@media (prefers-reduced-motion: reduce){
  html[data-app-scope="trader"] body.tr-app .rq-caps-st.on .d{ animation:none; }
}

/* ==================================================================
   Тумблеры ON/OFF по всему кабинету — круглый ползунок из концепта:
   трек 38×21, зелёный при включении, белая шайба. Перекрывает
   сегментный OFF|ON из aurora-блока (там !important).
   ================================================================== */
html[data-app-scope="trader"] body.tr-app .req-switch,
html[data-app-scope="trader"] body.tr-app button.req-switch,
html[data-app-scope="trader"] body.tr-app .tr-traffic-switch{
  position:relative;
  width:38px !important;
  min-width:38px !important;
  height:21px !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:var(--tr-line) !important;
  box-shadow:none !important;
  overflow:visible !important;
  cursor:pointer;
  transition:background .15s ease;
  flex:none;
}
html[data-app-scope="trader"] body.tr-app .req-switch.is-on,
html[data-app-scope="trader"] body.tr-app button.req-switch.is-on,
html[data-app-scope="trader"] body.tr-app .req-switch[aria-checked="true"],
html[data-app-scope="trader"] body.tr-app button.req-switch[aria-checked="true"]{
  background:var(--nb-green) !important;
}
/* прячем текстовые OFF|ON псевдоэлементы сегментного варианта */
html[data-app-scope="trader"] body.tr-app .req-switch::before,
html[data-app-scope="trader"] body.tr-app .req-switch::after{
  content:none !important;
  display:none !important;
}
/* шайба */
html[data-app-scope="trader"] body.tr-app .req-switch .req-switch-slider{
  position:absolute !important;
  top:2px !important;
  left:2px !important;
  width:17px !important;
  height:17px !important;
  border-radius:50% !important;
  background:#fff !important;
  border:0 !important;
  box-shadow:0 1px 3px rgba(0,0,0,.28) !important;
  transform:none !important;
  transition:left .15s ease !important;
}
html[data-app-scope="trader"] body.tr-app .req-switch .req-switch-slider::before{
  content:none !important;
  display:none !important;
}
html[data-app-scope="trader"] body.tr-app .req-switch.is-on .req-switch-slider,
html[data-app-scope="trader"] body.tr-app .req-switch[aria-checked="true"] .req-switch-slider{
  left:19px !important;
  transform:none !important;
}
html[data-app-scope="trader"] body.tr-app .req-switch:focus-visible{
  outline:2px solid var(--tr-purple);
  outline-offset:2px;
}
/* /тумблеры */

/* ==================================================================
   Настройка АЗ — концепт A3 «статус-визард»: живая статус-панель,
   карточка подключения (QR + токен), инструкция в аккордеоне,
   зелёная плашка тестовой транзакции.
   ================================================================== */
@keyframes az3-ping{
  0%{ transform:scale(1); opacity:.7; }
  70%,100%{ transform:scale(2.2); opacity:0; }
}
html[data-app-scope="trader"] body.tr-app .az3{ display:flex; flex-direction:column; gap:12px; }

/* статус-панель */
html[data-app-scope="trader"] body.tr-app .az3-status{
  display:flex; align-items:center; gap:11px;
  border-radius:12px; padding:11px 13px;
  background:linear-gradient(135deg,var(--nb-violet-2),var(--tr-purple-soft));
  border:1px solid var(--tr-line);
}
html[data-app-scope="trader"] body.tr-app .az3-status.on{
  background:linear-gradient(135deg,var(--nb-green-2),rgba(18,160,106,.05));
  border-color:rgba(18,160,106,.3);
}
html[data-app-scope="trader"] body.tr-app .az3-dw{ position:relative; width:10px; height:10px; flex:none; }
html[data-app-scope="trader"] body.tr-app .az3-dw i{ position:absolute; inset:0; border-radius:50%; background:var(--nb-amber); }
html[data-app-scope="trader"] body.tr-app .az3-status.on .az3-dw i{ background:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .az3-dw i.ring{ animation:az3-ping 1.6s cubic-bezier(0,0,.2,1) infinite; }
html[data-app-scope="trader"] body.tr-app .az3-status.on .az3-dw i.ring{ animation:none; opacity:0; }
html[data-app-scope="trader"] body.tr-app .az3-stt{ font-size:.78rem; font-weight:750; color:var(--tr-text); }
html[data-app-scope="trader"] body.tr-app .az3-std{ font-size:.64rem; color:var(--tr-muted); margin-top:1px; }

/* карточка подключения */
html[data-app-scope="trader"] body.tr-app .az3-conn{
  display:flex; gap:14px; align-items:center;
  border:1px solid var(--tr-line); border-radius:14px; padding:12px;
  background:var(--tr-surface);
}
html[data-app-scope="trader"] body.tr-app .az3-qr{
  width:130px; height:130px; flex:none; border-radius:10px;
  background:#fff; border:1px solid var(--tr-line); padding:6px;
}
html[data-app-scope="trader"] body.tr-app .az3-connr{ flex:1; min-width:0; display:flex; flex-direction:column; gap:7px; }
html[data-app-scope="trader"] body.tr-app .az3-bank{ font-size:.72rem; font-weight:700; color:var(--tr-text); }
html[data-app-scope="trader"] body.tr-app .az3-l{
  font-size:.56rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .az3-token{ display:flex; gap:7px; }
html[data-app-scope="trader"] body.tr-app .az3-token input{
  flex:1; min-width:0; height:34px !important;
  border-radius:9px !important; border:1px solid var(--tr-line) !important;
  background:var(--tr-surface-2) !important;
  font-size:.62rem !important; color:var(--tr-text) !important;
}
html[data-app-scope="trader"] body.tr-app .az3-token .az-copy-btn{
  height:34px !important; min-height:0 !important; padding:0 12px !important;
  border-radius:9px !important; font-size:.68rem !important; font-weight:700 !important;
  border:1px solid var(--tr-line) !important;
  background:linear-gradient(180deg,#fff,#eef1f8) !important;
  color:var(--tr-text) !important;
  box-shadow:0 2px 0 rgba(22,27,43,.08) !important;
  white-space:nowrap;
}
html[data-app-scope="trader"] body.tr-app .az3-hint{ font-size:.64rem; color:var(--tr-muted); }

/* аккордеон-инструкция */
html[data-app-scope="trader"] body.tr-app .az3-acc{
  border:1px solid var(--tr-line); border-radius:12px; background:var(--tr-surface);
}
html[data-app-scope="trader"] body.tr-app .az3-acc summary{
  display:flex; align-items:center; gap:9px;
  padding:10px 13px; cursor:pointer; list-style:none;
  font-size:.72rem; font-weight:700; color:var(--tr-text);
}
html[data-app-scope="trader"] body.tr-app .az3-acc summary::-webkit-details-marker{ display:none; }
html[data-app-scope="trader"] body.tr-app .az3-acc summary svg{ color:var(--tr-purple); flex:none; }
html[data-app-scope="trader"] body.tr-app .az3-chev{ margin-left:auto; color:var(--tr-muted); transition:transform .15s; font-size:.7rem; }
html[data-app-scope="trader"] body.tr-app .az3-acc[open] .az3-chev{ transform:rotate(180deg); }
html[data-app-scope="trader"] body.tr-app .az3-steps{
  margin:0; padding:2px 13px 4px 30px; display:flex; flex-direction:column; gap:6px;
  font-size:.7rem; color:var(--tr-text); line-height:1.45;
}
html[data-app-scope="trader"] body.tr-app .az3-foot{
  margin:0; padding:6px 13px 11px; font-size:.62rem; color:var(--tr-muted);
}

/* тестовая транзакция */
html[data-app-scope="trader"] body.tr-app .az3-test{
  display:flex; align-items:center; gap:10px;
  border:1px solid rgba(18,160,106,.3); background:var(--nb-green-2);
  border-radius:12px; padding:10px 12px;
}
html[data-app-scope="trader"] body.tr-app .az3-test-ic{
  width:30px; height:30px; border-radius:9px; flex:none;
  display:grid; place-items:center;
  background:var(--tr-surface); color:var(--nb-green);
  border:1px solid rgba(18,160,106,.3);
}
html[data-app-scope="trader"] body.tr-app .az3-test-txt{ flex:1; min-width:0; }
html[data-app-scope="trader"] body.tr-app .az3-test-t{ font-size:.72rem; font-weight:750; color:var(--tr-text); }
html[data-app-scope="trader"] body.tr-app .az3-test-d{ font-size:.62rem; color:var(--tr-muted); margin-top:1px; }
html[data-app-scope="trader"] body.tr-app .az3-test-go{
  width:auto !important; max-width:none !important; flex:none !important;
  margin:0 !important;
  border:0 !important; cursor:pointer;
  min-height:0 !important; padding:8px 13px !important; border-radius:9px !important;
  font-size:.7rem !important; font-weight:700 !important; color:#fff !important;
  background:linear-gradient(180deg,#17b877,#0d9862) !important;
  box-shadow:0 2px 0 #0d7a51, 0 4px 10px -3px rgba(18,160,106,.45) !important;
  white-space:nowrap;
  transition:transform .1s ease;
}
html[data-app-scope="trader"] body.tr-app .az3-test-go:hover:not(:disabled){ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app .az3-test-go:disabled{ opacity:.6; }
@media (prefers-reduced-motion: reduce){
  html[data-app-scope="trader"] body.tr-app .az3-dw i.ring{ animation:none; }
}
/* /Настройка АЗ A3 */

/* ==================================================================
   Формы в дроверах кабинета — необанк-кожа: скругления, мягкие поля,
   капс-метки, индиго-3D primary-кнопка. Убирает «острые углы» у форм
   реквизита (создание/настройки) и остальных дроверов.
   ================================================================== */
html[data-app-scope="trader"] body.tr-app .drawer .form-row label{
  display:block;
  font-size:.6rem !important;
  font-weight:800 !important;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--tr-muted) !important;
  margin-bottom:5px;
}
html[data-app-scope="trader"] body.tr-app .drawer .form-row input,
html[data-app-scope="trader"] body.tr-app .drawer .form-row select,
html[data-app-scope="trader"] body.tr-app .drawer .form-row textarea{
  width:100%;
  height:38px !important;
  min-height:0 !important;
  border-radius:10px !important;
  border:1px solid var(--tr-line) !important;
  background:var(--tr-surface-2) !important;
  color:var(--tr-text) !important;
  padding:0 12px !important;
  font-size:.8rem !important;
  box-shadow:none !important;
  transition:border-color .15s, background .15s;
}
html[data-app-scope="trader"] body.tr-app .drawer .form-row textarea{ height:auto !important; padding:10px 12px !important; }
html[data-app-scope="trader"] body.tr-app .drawer .form-row input:focus,
html[data-app-scope="trader"] body.tr-app .drawer .form-row select:focus,
html[data-app-scope="trader"] body.tr-app .drawer .form-row textarea:focus{
  border-color:var(--tr-purple) !important;
  background:var(--tr-surface) !important;
  outline:none;
}
html[data-app-scope="trader"] body.tr-app .drawer .form-row input[readonly]{ opacity:.85; }
html[data-app-scope="trader"] body.tr-app .drawer .field-hint{
  font-size:.62rem;
  color:var(--tr-muted);
  margin-top:4px;
}
html[data-app-scope="trader"] body.tr-app .drawer .form-section-title{
  font-size:.62rem !important;
  font-weight:800 !important;
  text-transform:uppercase;
  letter-spacing:.07em;
  color:var(--tr-purple) !important;
  margin:6px 0 10px !important;
  padding:0 !important;
  border:0 !important;
}
html[data-app-scope="trader"] body.tr-app .drawer .form-grid{ gap:11px !important; }

/* кнопки действий дровера: primary — индиго 3D, secondary — светлая ghost */
html[data-app-scope="trader"] body.tr-app .drawer .drawer-actions{
  display:flex; gap:9px; margin-top:6px;
}
html[data-app-scope="trader"] body.tr-app .drawer .drawer-actions button:not(.secondary):not(.po-go):not(.az3-test-go){
  border:0 !important;
  min-height:0 !important;
  padding:11px 16px !important;
  border-radius:11px !important;
  font-size:.8rem !important;
  font-weight:700 !important;
  color:#fff !important;
  background:linear-gradient(180deg,#5468ff,#3d54e0) !important;
  box-shadow:0 2px 0 #2a3aa8, 0 6px 14px -4px rgba(61,84,224,.45) !important;
  cursor:pointer;
  transition:transform .1s ease;
}
html[data-app-scope="trader"] body.tr-app .drawer .drawer-actions button:not(.secondary):hover:not(:disabled){ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app .drawer .drawer-actions .secondary{
  border:1px solid var(--tr-line) !important;
  min-height:0 !important;
  padding:11px 15px !important;
  border-radius:11px !important;
  font-size:.78rem !important;
  font-weight:700 !important;
  color:var(--tr-text) !important;
  background:linear-gradient(180deg,#fff,#eef1f8) !important;
  box-shadow:0 2px 0 rgba(22,27,43,.08) !important;
  cursor:pointer;
}
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .drawer .drawer-actions .secondary{
  background:linear-gradient(180deg,var(--tr-surface-2),var(--tr-surface)) !important;
  box-shadow:0 2px 0 rgba(0,0,0,.5) !important;
}
/* /формы дроверов */

/* боковой дровер — плавающая карточка со скруглением, как топбар */
@media (min-width: 901px){
  html[data-app-scope="trader"] body.tr-app .drawer:not(.centered){
    top:14px !important;
    right:14px !important;
    bottom:14px !important;
    height:auto !important;
    max-height:calc(100vh - 28px) !important;
    border-radius:18px !important;
    overflow:hidden !important;
    box-shadow:0 2px 8px rgba(22,27,43,.07), 0 32px 70px -28px rgba(30,40,90,.5) !important;
  }
}

/* ==================================================================
   Кастомный дропдаун банка в форме реквизита: логотипы в списке,
   скруглённый попап в стиле дровера.
   ================================================================== */
html[data-app-scope="trader"] body.tr-app .bnk-dd{ position:relative; }
html[data-app-scope="trader"] body.tr-app .bnk-dd-btn{
  width:100%; height:38px;
  display:flex; align-items:center; gap:8px;
  border-radius:10px !important;
  border:1px solid var(--tr-line) !important;
  background:var(--tr-surface-2) !important;
  color:var(--tr-text) !important;
  padding:0 12px !important;
  font:inherit; font-size:.8rem;
  cursor:pointer;
  transition:border-color .15s, background .15s;
}
html[data-app-scope="trader"] body.tr-app .bnk-dd-btn:hover,
html[data-app-scope="trader"] body.tr-app .bnk-dd-btn[aria-expanded="true"]{
  border-color:var(--tr-purple) !important;
  background:var(--tr-surface) !important;
}
html[data-app-scope="trader"] body.tr-app .bnk-dd-cur{
  display:flex; align-items:center; gap:8px; min-width:0; flex:1;
}
html[data-app-scope="trader"] body.tr-app .bnk-dd-ph{ color:var(--tr-muted); }
html[data-app-scope="trader"] body.tr-app .bnk-dd-chev{ color:var(--tr-muted); flex:none; }
html[data-app-scope="trader"] body.tr-app .bnk-dd-name{
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:600;
}
html[data-app-scope="trader"] body.tr-app .bnk-mini{
  width:18px; height:18px; flex:none; border-radius:5px; display:block;
  background:#fff; border:1px solid var(--tr-line); padding:1px;
}
html[data-app-scope="trader"] body.tr-app .bnk-mini--fb{
  display:inline-grid; place-items:center;
  background:var(--tr-surface-2); color:var(--tr-muted);
  font-size:.5rem; font-weight:800; padding:0;
}
/* попап-список */
html[data-app-scope="trader"] body.tr-app .bnk-dd-pop{
  position:absolute; z-index:60;
  top:calc(100% + 6px); left:0; right:0;
  max-height:264px; overflow-y:auto;
  background:var(--tr-surface);
  border:1px solid var(--tr-line);
  border-radius:14px;
  box-shadow:0 2px 8px rgba(22,27,43,.07), 0 24px 54px -22px rgba(30,40,90,.45);
  padding:5px;
}
html[data-app-scope="trader"] body.tr-app .bnk-dd-item{
  width:100%; display:flex; align-items:center; gap:9px;
  border:0; background:transparent; cursor:pointer;
  padding:8px 9px; border-radius:9px;
  font:inherit; font-size:.76rem; color:var(--tr-text); text-align:left;
}
html[data-app-scope="trader"] body.tr-app .bnk-dd-item:hover{ background:var(--tr-purple-soft); }
html[data-app-scope="trader"] body.tr-app .bnk-dd-check{ margin-left:auto; color:var(--tr-purple); opacity:0; flex:none; }
html[data-app-scope="trader"] body.tr-app .bnk-dd-item.is-sel{ background:var(--tr-purple-soft); }
html[data-app-scope="trader"] body.tr-app .bnk-dd-item.is-sel .bnk-dd-check{ opacity:1; }
html[data-app-scope="trader"] body.tr-app .bnk-dd-other{
  border-top:1px solid var(--tr-line); border-radius:0 0 9px 9px; margin-top:3px; padding-top:9px;
  color:var(--tr-muted);
}
/* /дропдаун банка */

/* пилюли «Всего / В выдаче» — кликабельные фильтры списка */
html[data-app-scope="trader"] body.tr-app .rq-cnt{
  border:1px solid var(--tr-line);
  cursor:pointer;
  font:inherit;
  font-size:.68rem;
  font-weight:700;
  transition:border-color .15s, background .15s, transform .1s;
}
html[data-app-scope="trader"] body.tr-app .rq-cnt:hover{
  border-color:var(--tr-purple);
  transform:translateY(-1px);
}
html[data-app-scope="trader"] body.tr-app .rq-cnt.is-act{
  border-color:var(--tr-purple);
  background:var(--tr-purple-soft);
  color:var(--tr-purple);
}
html[data-app-scope="trader"] body.tr-app .rq-cnt.is-act b{ color:var(--tr-purple); }
html[data-app-scope="trader"] body.tr-app .rq-cnt--g:hover{ border-color:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .rq-cnt--g.is-act{
  border-color:var(--nb-green);
  background:var(--nb-green-2);
  color:var(--nb-green);
}
html[data-app-scope="trader"] body.tr-app .rq-cnt--g.is-act b{ color:var(--nb-green); }

/* ==================================================================
   Диспуты (апелляции): строки-карточки с чеком мерчанта и действиями.
   ================================================================== */
html[data-app-scope="trader"] body.tr-app .dsp-rows{ display:flex; flex-direction:column; gap:9px; }
html[data-app-scope="trader"] body.tr-app .dsp-row{
  background:var(--tr-surface); border:1px solid var(--tr-line); border-radius:13px;
  padding:11px 14px; box-shadow:0 1px 2px rgba(22,27,43,.04);
}
html[data-app-scope="trader"] body.tr-app .dsp-main{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
html[data-app-scope="trader"] body.tr-app .dsp-ic{
  width:32px; height:32px; border-radius:9px; flex:none;
  display:grid; place-items:center;
  background:var(--nb-amber-2); color:var(--nb-amber);
}
html[data-app-scope="trader"] body.tr-app .dsp-id{ min-width:0; width:210px; flex:none; }
html[data-app-scope="trader"] body.tr-app .dsp-oid{
  font-size:.68rem; color:var(--tr-text); font-weight:700;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
html[data-app-scope="trader"] body.tr-app .dsp-sub{ font-size:.62rem; color:var(--tr-muted); margin-top:1px; }
html[data-app-scope="trader"] body.tr-app .dsp-fact{ display:flex; flex-direction:column; gap:2px; min-width:130px; }
html[data-app-scope="trader"] body.tr-app .dsp-l{
  font-size:.55rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--tr-muted); opacity:.8;
}
html[data-app-scope="trader"] body.tr-app .dsp-v{ font-size:.68rem; color:var(--tr-muted); }
html[data-app-scope="trader"] body.tr-app .dsp-v b{ color:var(--tr-text); }
html[data-app-scope="trader"] body.tr-app .dsp-actions{ margin-left:auto; display:inline-flex; gap:7px; flex-wrap:wrap; }
html[data-app-scope="trader"] body.tr-app .dsp-btn{
  border:1px solid var(--tr-line); background:linear-gradient(180deg,#fff,#eef1f8);
  color:var(--tr-text); font:inherit; font-size:.68rem; font-weight:700;
  padding:7px 11px; border-radius:9px; cursor:pointer;
  box-shadow:0 2px 0 rgba(22,27,43,.08);
  transition:transform .1s ease;
}
html[data-app-scope="trader"] body.tr-app .dsp-btn:hover{ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app .dsp-btn--ok{
  border:0; color:#fff;
  background:linear-gradient(180deg,#17b877,#0d9862);
  box-shadow:0 2px 0 #0d7a51, 0 4px 10px -3px rgba(18,160,106,.45);
}
html[data-app-scope="trader"] body.tr-app .dsp-btn--no{
  border:1px solid rgba(229,72,77,.4); color:var(--nb-red);
  background:var(--nb-red-2); box-shadow:none;
}
html[data-app-scope="trader"] body.tr-app .dsp-comment{
  margin-top:9px; padding:8px 11px; border-radius:10px;
  background:var(--tr-surface-2); font-size:.7rem; color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .dsp-comment-full{
  margin:10px 0 0; padding:9px 12px; border-radius:10px;
  background:var(--tr-surface-2); font-size:.74rem; color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .dsp-reject-lead{
  margin:0; font-size:.76rem; color:var(--tr-muted); line-height:1.5;
}
/* решённые диспуты — тем же списком, приглушённо */
html[data-app-scope="trader"] body.tr-app .dsp-sec{
  margin-top:6px; font-size:.62rem; font-weight:800; letter-spacing:.09em;
  text-transform:uppercase; color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .dsp-row--done{ opacity:.78; }
html[data-app-scope="trader"] body.tr-app .dsp-row--done .dsp-ic{ filter:grayscale(.4); }
/* данные PayIn-заявки в дровере чека: создан · реквизит · сумма */
html[data-app-scope="trader"] body.tr-app .dsp-order-facts{
  display:flex; gap:20px; flex-wrap:wrap;
  margin:0 0 12px; padding:10px 14px; border-radius:12px;
  background:var(--tr-surface-2);
}
html[data-app-scope="trader"] body.tr-app .dsp-order-facts .dsp-fact{ min-width:110px; }
/* тёмная тема: вторичная кнопка «Чек мерчанта» — тёмная поверхность + светлый текст (перебиваем белый градиент базы по специфичности) */
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .dsp-btn{
  background:linear-gradient(180deg,#252b38,#1b212b);
  border-color:var(--tr-line); color:var(--tr-text);
  box-shadow:0 2px 0 rgba(0,0,0,.35);
}
html[data-app-scope="trader"] body.tr-app[data-theme="dark"] .dsp-btn:hover{ border-color:rgba(91,157,255,.45); }
/* /диспуты */

/* ===== Депозит — витрина D2: градиентная карта + доход + лента операций ===== */
html[data-app-scope="trader"] body.tr-app .dep-hero{
  display:grid; grid-template-columns:1.25fr 1fr; gap:16px; margin-bottom:16px;
}
html[data-app-scope="trader"] body.tr-app .dep-card{
  border-radius:18px; padding:22px 24px; color:#fff; position:relative; overflow:hidden;
  background:linear-gradient(135deg,#3d54e0 0%,#5b46d8 55%,#7b5cf0 100%);
  box-shadow:0 16px 34px rgba(61,84,224,.35);
}
html[data-app-scope="trader"] body.tr-app .dep-card::after{
  content:""; position:absolute; right:-70px; top:-70px; width:230px; height:230px;
  border-radius:50%; background:rgba(255,255,255,.10); pointer-events:none;
}
html[data-app-scope="trader"] body.tr-app .dep-cap{
  font-size:0.73rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.65);
}
html[data-app-scope="trader"] body.tr-app .dep-cap--dark{ color:var(--tr-muted); }
html[data-app-scope="trader"] body.tr-app .dep-big{
  font-size:2.1rem; font-weight:800; margin:6px 0 2px; line-height:1.1;
}
html[data-app-scope="trader"] body.tr-app .dep-big .dep-cur{ font-size:1rem; font-weight:700; }
html[data-app-scope="trader"] body.tr-app .dep-sub{ color:rgba(255,255,255,.75); font-size:0.88rem; }
html[data-app-scope="trader"] body.tr-app .dep-chips{ display:flex; gap:8px; margin-top:16px; flex-wrap:wrap; }
html[data-app-scope="trader"] body.tr-app .dep-chip{
  background:rgba(255,255,255,.16); border-radius:999px; padding:5px 12px;
  font-size:0.79rem; font-weight:700; color:#fff;
}
html[data-app-scope="trader"] body.tr-app .dep-actions{ margin-top:18px; display:flex; gap:10px; position:relative; z-index:1; }
html[data-app-scope="trader"] body.tr-app .dep-act{
  background:#fff !important; color:var(--tr-purple) !important; border:0 !important;
  border-radius:11px !important; font-weight:800 !important; font-size:0.95rem !important;
  padding:9px 18px !important; cursor:pointer; width:auto !important;
  box-shadow:0 5px 14px rgba(10,16,50,.25) !important;
}
html[data-app-scope="trader"] body.tr-app .dep-act:hover{ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app .dep-income{
  padding:18px 20px; display:flex; flex-direction:column; gap:12px;
}
html[data-app-scope="trader"] body.tr-app .dep-income-head{
  display:flex; justify-content:space-between; align-items:baseline;
}
html[data-app-scope="trader"] body.tr-app .dep-income-total{ font-size:1.35rem; color:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .dep-bar{
  height:7px; border-radius:99px; background:var(--tr-surface-2); overflow:hidden;
}
html[data-app-scope="trader"] body.tr-app .dep-bar i{
  display:block; height:100%; background:linear-gradient(90deg,#22c07a,#3d54e0);
}
html[data-app-scope="trader"] body.tr-app .dep-row{
  display:flex; justify-content:space-between; font-size:0.93rem;
}
html[data-app-scope="trader"] body.tr-app .dep-row span{ color:var(--tr-muted); }
/* «Доступно к переводу» — отделено от lifetime-статистики */
html[data-app-scope="trader"] body.tr-app .dep-row--avail{
  border-top:1px solid var(--tr-line); padding-top:11px; margin-top:2px;
}
html[data-app-scope="trader"] body.tr-app .dep-row--avail b{ color:var(--nb-green); }
/* кнопка перевода B1: индиго-3D, сумма капсулой внутри */
html[data-app-scope="trader"] body.tr-app .dep-transfer-btn{
  margin-top:auto; width:100%; border:0 !important; border-radius:12px !important;
  padding:11px 16px !important; font-weight:800 !important; font-size:0.95rem !important;
  color:#fff !important; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  background:linear-gradient(180deg,#5b71ee,#3d54e0) !important;
  box-shadow:0 6px 14px rgba(61,84,224,.35), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
html[data-app-scope="trader"] body.tr-app .dep-transfer-btn:hover:not(:disabled){ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app .dep-transfer-btn:disabled{
  background:var(--tr-surface-2) !important; color:var(--tr-muted) !important;
  box-shadow:none !important; cursor:default; transform:none;
}
html[data-app-scope="trader"] body.tr-app .dep-transfer-amt{
  background:rgba(255,255,255,.18); border-radius:999px; padding:3px 11px; font-size:0.88rem;
}
html[data-app-scope="trader"] body.tr-app .dep-transfer-btn:disabled .dep-transfer-amt{
  background:var(--tr-line); color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .dep-history-head{
  display:flex; align-items:center; justify-content:space-between; padding:14px 16px;
}
html[data-app-scope="trader"] body.tr-app .dep-history-head h2{ margin:0; font-size:1rem; }
html[data-app-scope="trader"] body.tr-app .dep-filter{ display:inline-flex; gap:7px; }
html[data-app-scope="trader"] body.tr-app .dep-filter .phs{ cursor:pointer; border:0; }
html[data-app-scope="trader"] body.tr-app .dep-feed{ padding:2px 0 6px; }
html[data-app-scope="trader"] body.tr-app .dep-item{
  display:flex; align-items:center; gap:13px; padding:11px 20px; border-top:1px solid var(--tr-line);
}
html[data-app-scope="trader"] body.tr-app .dep-item:first-child{ border-top:0; }
html[data-app-scope="trader"] body.tr-app .dep-ic{
  width:32px; height:32px; border-radius:10px; display:grid; place-items:center; flex:none;
  font-size:1rem; font-weight:800;
}
html[data-app-scope="trader"] body.tr-app .dep-ic--g{ background:var(--nb-green-2); color:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .dep-ic--p{ background:var(--tr-purple-soft); color:var(--tr-purple); }
html[data-app-scope="trader"] body.tr-app .dep-ic--o{ background:var(--nb-amber-2); color:var(--nb-amber); }
html[data-app-scope="trader"] body.tr-app .dep-meta{ flex:1; min-width:0; }
html[data-app-scope="trader"] body.tr-app .dep-t{ font-size:0.93rem; font-weight:700; color:var(--tr-text); }
html[data-app-scope="trader"] body.tr-app .dep-s{ font-size:0.79rem; color:var(--tr-muted); margin-top:1px; }
html[data-app-scope="trader"] body.tr-app .dep-amt{ font-weight:800; font-size:0.98rem; color:var(--tr-muted); }
html[data-app-scope="trader"] body.tr-app .dep-amt.plus{ color:var(--nb-green); }
html[data-app-scope="trader"] body.tr-app .dep-more{
  display:block; width:calc(100% - 40px); margin:10px 20px 12px;
  border:1px solid var(--tr-line) !important; border-radius:11px !important;
  background:var(--tr-surface-2) !important; color:var(--tr-muted) !important;
  font-size:0.88rem !important; font-weight:700 !important; padding:9px 0 !important; cursor:pointer;
}
html[data-app-scope="trader"] body.tr-app .dep-more:hover{ color:var(--tr-purple) !important; }
/* дровер пополнения */
html[data-app-scope="trader"] body.tr-app .dep-topup{
  display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center;
}
html[data-app-scope="trader"] body.tr-app .dep-topup-qr{
  background:#fff; border:1px solid var(--tr-line); border-radius:14px; padding:10px; line-height:0;
}
html[data-app-scope="trader"] body.tr-app .dep-topup-net{
  display:inline-flex; font-size:0.77rem; font-weight:700; padding:3px 10px; border-radius:999px;
  background:var(--nb-green-2); color:var(--nb-green);
}
html[data-app-scope="trader"] body.tr-app .dep-topup-addr{
  display:block; width:100%; background:var(--tr-surface-2); border:1px dashed #c9d3ea;
  border-radius:11px; padding:10px 12px; font-size:0.88rem; word-break:break-all;
}
html[data-app-scope="trader"] body.tr-app .dep-topup-copy{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100% !important;
}
html[data-app-scope="trader"] body.tr-app .dep-topup-copy svg{
  width:14px !important; height:14px !important; flex:none;
}
/* T1: шаги пополнения + янтарное предупреждение */
html[data-app-scope="trader"] body.tr-app .dep-steps{
  display:grid; grid-template-columns:repeat(3,1fr); gap:8px; width:100%;
}
html[data-app-scope="trader"] body.tr-app .dep-step{
  font-size:0.77rem; color:var(--tr-muted); line-height:1.4; text-align:center;
}
html[data-app-scope="trader"] body.tr-app .dep-step-n{
  display:block; font-size:0.73rem; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color:var(--tr-purple); margin-bottom:3px;
}
html[data-app-scope="trader"] body.tr-app .dep-warn{
  display:flex; gap:9px; width:100%; background:var(--nb-amber-2); border-radius:11px;
  padding:9px 12px; font-size:0.81rem; color:#7d5407; line-height:1.45; text-align:left;
}
@media (max-width: 1080px){
  html[data-app-scope="trader"] body.tr-app .dep-hero{ grid-template-columns:1fr; }
}
/* /депозит */

/* ===== Логи АЗ — таблица+ (L1): фильтры-пилюли, поиск, пуш-плашки ===== */
html[data-app-scope="trader"] body.tr-app .azl-head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px; flex-wrap:wrap;
}
html[data-app-scope="trader"] body.tr-app .azl-filters{ display:inline-flex; gap:7px; flex-wrap:wrap; }
html[data-app-scope="trader"] body.tr-app .azl-pill{
  cursor:pointer; border:0; background:var(--tr-surface-2); color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .azl-search{
  background:var(--tr-surface-2) !important; border:1px solid var(--tr-line) !important;
  border-radius:10px !important; padding:7px 12px !important; font-size:0.88rem !important;
  color:var(--tr-text) !important; width:250px; max-width:100%;
}
html[data-app-scope="trader"] body.tr-app .azl-search::placeholder{ color:var(--tr-muted); }
html[data-app-scope="trader"] body.tr-app .azl-push{
  background:var(--tr-surface-2); border-radius:9px; padding:7px 10px;
  font-size:0.85rem; line-height:1.45; color:var(--tr-text); max-width:520px;
}
html[data-app-scope="trader"] body.tr-app .azl-pkg{ color:var(--tr-muted); font-size:0.76rem; margin-top:3px; }
html[data-app-scope="trader"] body.tr-app .azl-order{ margin-top:4px; font-size:0.79rem; }
html[data-app-scope="trader"] body.tr-app .azl-table td{ vertical-align:top; }
/* /логи АЗ */

/* ===== Настройки — центр безопасности (S3) ===== */
html[data-app-scope="trader"] body.tr-app .sec-grid{
  display:grid; grid-template-columns:300px 1fr; gap:16px; align-items:start;
}
@media (max-width: 1080px){
  html[data-app-scope="trader"] body.tr-app .sec-grid{ grid-template-columns:1fr; }
}
html[data-app-scope="trader"] body.tr-app .sec-score{ padding:20px; text-align:center; }
html[data-app-scope="trader"] body.tr-app .sec-cap{
  font-size:0.73rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--tr-muted); margin-bottom:14px;
}
html[data-app-scope="trader"] body.tr-app .sec-ring{ position:relative; width:130px; height:130px; margin:0 auto 14px; }
html[data-app-scope="trader"] body.tr-app .sec-ring-val{
  position:absolute; inset:0; display:grid; place-items:center;
}
html[data-app-scope="trader"] body.tr-app .sec-ring-val b{ font-size:1.5rem; display:block; }
html[data-app-scope="trader"] body.tr-app .sec-ring-val span{ font-size:0.73rem; color:var(--tr-muted); display:block; }
html[data-app-scope="trader"] body.tr-app .sec-checks{
  text-align:left; display:flex; flex-direction:column; gap:9px;
}
html[data-app-scope="trader"] body.tr-app .sec-check{
  display:flex; gap:8px; font-size:0.85rem; color:var(--tr-text); line-height:1.4;
}
html[data-app-scope="trader"] body.tr-app .sec-check--warn{ color:var(--tr-muted); }
html[data-app-scope="trader"] body.tr-app .sec-check .sec-check-ic{ color:var(--nb-green); font-weight:800; flex:none; }
html[data-app-scope="trader"] body.tr-app .sec-check--warn .sec-check-ic{ color:var(--nb-amber); }
html[data-app-scope="trader"] body.tr-app .sec-cards{ display:flex; flex-direction:column; gap:16px; }
html[data-app-scope="trader"] body.tr-app .sec-card{ padding:16px 18px; }
html[data-app-scope="trader"] body.tr-app .panel.sec-card--warn{ border-left:3px solid var(--nb-amber) !important; }
html[data-app-scope="trader"] body.tr-app .sec-row{ display:flex; align-items:center; gap:14px; }
html[data-app-scope="trader"] body.tr-app .sec-ic{
  width:34px; height:34px; border-radius:10px; display:grid; place-items:center; flex:none; font-size:1rem;
}
html[data-app-scope="trader"] body.tr-app .sec-ic--pass{ background:var(--nb-amber-2); }
html[data-app-scope="trader"] body.tr-app .sec-ic--tg{ background:var(--nb-violet-2); }
html[data-app-scope="trader"] body.tr-app .sec-ic--2fa{ background:var(--nb-green-2); }
html[data-app-scope="trader"] body.tr-app .sec-row-main{ flex:1; min-width:0; }
html[data-app-scope="trader"] body.tr-app .sec-row-main b{ font-size:0.95rem; color:var(--tr-text); }
html[data-app-scope="trader"] body.tr-app .sec-sub{ font-size:0.78rem; color:var(--tr-muted); margin-top:2px; }
html[data-app-scope="trader"] body.tr-app .sec-sub--warn{ color:var(--nb-amber); font-weight:700; }
html[data-app-scope="trader"] body.tr-app .sec-sub--ok{ color:var(--nb-green); font-weight:700; }
/* кнопки: secondary по умолчанию, primary — индиго-3D, danger — красная */
html[data-app-scope="trader"] body.tr-app .sec-btn{
  border:1px solid var(--tr-line) !important; border-radius:10px !important;
  background:var(--tr-surface) !important; color:var(--tr-text) !important;
  font-weight:700 !important; font-size:0.88rem !important; padding:8px 14px !important;
  cursor:pointer; width:auto !important; flex:none;
}
html[data-app-scope="trader"] body.tr-app .sec-btn:hover{ color:var(--tr-purple) !important; }
html[data-app-scope="trader"] body.tr-app .sec-btn--primary{
  border:0 !important; color:#fff !important;
  background:linear-gradient(180deg,#5b71ee,#3d54e0) !important;
  box-shadow:0 5px 12px rgba(61,84,224,.32), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
html[data-app-scope="trader"] body.tr-app .sec-btn--primary:hover{ color:#fff !important; transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app .sec-btn--danger{
  border:0 !important; color:#fff !important;
  background:linear-gradient(180deg,#e4677a,#d84c5a) !important;
  box-shadow:0 5px 12px rgba(216,76,90,.3), inset 0 1px 0 rgba(255,255,255,.25) !important;
}
html[data-app-scope="trader"] body.tr-app .sec-body{
  margin-top:14px; padding-top:14px; border-top:1px solid var(--tr-line);
}
html[data-app-scope="trader"] body.tr-app .sec-pass-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:12px;
}
@media (max-width: 900px){
  html[data-app-scope="trader"] body.tr-app .sec-pass-grid{ grid-template-columns:1fr; }
}
html[data-app-scope="trader"] body.tr-app .sec-field label{
  display:block; font-size:0.73rem; font-weight:800; letter-spacing:.09em;
  text-transform:uppercase; color:var(--tr-muted); margin-bottom:5px;
}
html[data-app-scope="trader"] body.tr-app .sec-field input{
  width:100%; background:var(--tr-surface-2) !important; border:1px solid var(--tr-line) !important;
  border-radius:10px !important; padding:9px 12px !important; font-size:0.93rem !important;
  color:var(--tr-text) !important;
}
html[data-app-scope="trader"] body.tr-app .sec-field--code input{
  width:120px; text-align:center; font-variant-numeric:tabular-nums; letter-spacing:.2em;
}
html[data-app-scope="trader"] body.tr-app .sec-tg-line{ display:flex; gap:10px; align-items:center; }
html[data-app-scope="trader"] body.tr-app .sec-tg-input{
  flex:1; max-width:280px; display:flex; align-items:center; gap:2px;
  background:var(--tr-surface-2); border:1px solid var(--tr-line); border-radius:10px; padding:0 12px;
}
html[data-app-scope="trader"] body.tr-app .sec-tg-input span{ color:var(--tr-muted); font-weight:800; }
html[data-app-scope="trader"] body.tr-app .sec-tg-input input{
  border:0 !important; background:transparent !important; padding:9px 4px !important;
  font-size:0.93rem !important; color:var(--tr-text) !important; width:100%;
}
html[data-app-scope="trader"] body.tr-app .sec-2fa-disable{ display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; }
html[data-app-scope="trader"] body.tr-app .sec-2fa-setup{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
html[data-app-scope="trader"] body.tr-app .sec-hint{ margin:0; font-size:0.83rem; color:var(--tr-muted); line-height:1.5; }
html[data-app-scope="trader"] body.tr-app .sec-totp-wizard{
  display:flex; flex-direction:column; align-items:flex-start; gap:11px;
}
html[data-app-scope="trader"] body.tr-app .sec-totp-step{
  display:flex; align-items:center; gap:9px; font-size:0.88rem; font-weight:700; color:var(--tr-text);
}
html[data-app-scope="trader"] body.tr-app .sec-step-num{
  width:20px; height:20px; border-radius:50%; background:var(--tr-purple-soft); color:var(--tr-purple);
  display:grid; place-items:center; font-size:0.76rem; font-weight:800; flex:none;
}
html[data-app-scope="trader"] body.tr-app .sec-totp-secret{
  background:var(--tr-surface-2); border:1px dashed #c9d3ea; border-radius:10px;
  padding:8px 12px; font-size:0.88rem; word-break:break-all;
}
html[data-app-scope="trader"] body.tr-app .sec-totp-qr{
  background:#fff; border:1px solid var(--tr-line); border-radius:12px; padding:8px;
}
html[data-app-scope="trader"] body.tr-app .sec-totp-actions{ display:flex; gap:9px; }
/* /настройки */

/* ===== Таблицы (TT3): ID-чип с кнопкой копии + типографика карт ===== */
html[data-app-scope="trader"] body.tr-app .idchip{
  display:inline-flex; align-items:stretch; max-width:100%;
  border:1px solid var(--tr-line); border-radius:9px; overflow:hidden;
  cursor:pointer; background:var(--tr-surface); vertical-align:middle;
}
html[data-app-scope="trader"] body.tr-app .idchip-t{
  padding:4px 10px; font-size:12px; font-weight:500; color:var(--tr-text);
  background:var(--tr-surface-2); display:flex; align-items:center;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-family:inherit; letter-spacing:.01em;
}
html[data-app-scope="trader"] body.tr-app .idchip-cp{
  padding:4px 8px; color:var(--tr-muted); display:flex; align-items:center;
  border-left:1px solid var(--tr-line); background:var(--tr-surface); flex:none;
}
html[data-app-scope="trader"] body.tr-app .idchip:hover .idchip-cp,
html[data-app-scope="trader"] body.tr-app .idchip:focus-visible .idchip-cp{
  color:var(--tr-purple); background:var(--tr-purple-soft);
}
/* номера карт/реквизитов: системный шрифт с разрядкой вместо моно */
html[data-app-scope="trader"] body.tr-app .tbl-card{
  font-family:inherit !important; font-weight:700; font-size:13px;
  letter-spacing:.05em; font-variant-numeric:tabular-nums; color:var(--tr-text);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; max-width:100%;
}
html[data-app-scope="trader"] body.tr-app span.tbl-card{ display:inline-block; }
html[data-app-scope="trader"] body.tr-app .azl-order .idchip .idchip-t{ font-size:11px; padding:3px 8px; }
/* /таблицы TT3 */

/* ===== Вход трейдера — сплит LG2: брендинг слева, форма справа ===== */
/* сплит на весь экран: без карточки-обёртки */
html:has(.tr-lg2){ scrollbar-gutter:auto; } /* логин не скроллится — жёлоб не нужен */
html[data-app-scope="trader"] body.tr-app .tr-lg2{
  min-height:100vh; display:flex; padding:0;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-shell{
  display:flex; width:100%; min-height:100vh;
  border-radius:0; overflow:hidden; position:relative;
  background:var(--tr-surface); border:0; box-shadow:none;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-left{
  width:46%; position:relative; color:#fff; padding:26px 30px 22px;
  display:flex; flex-direction:column; overflow:hidden;
  background:linear-gradient(160deg,#3d54e0 0%,#5b46d8 55%,#7b5cf0 100%);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-left::after{
  content:""; position:absolute; width:340px; height:340px; border-radius:50%;
  right:-120px; bottom:-120px; background:rgba(255,255,255,.08); pointer-events:none;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-left::before{
  content:""; position:absolute; width:220px; height:220px; border-radius:50%;
  left:-80px; top:30%; background:rgba(255,255,255,.06); pointer-events:none;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-brand{
  display:flex; align-items:center; gap:12px; position:relative; z-index:2;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-brand .tr-brand-name--login{ color:#fff; }
html[data-app-scope="trader"] body.tr-app .tr-lg2-brand-sub{
  color:rgba(255,255,255,.7) !important; letter-spacing:.12em;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-slogan{
  position:relative; z-index:2;
  font-size:1.35rem; font-weight:800; line-height:1.3;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-chips{
  display:flex; gap:8px; margin-top:18px; flex-wrap:wrap; position:relative; z-index:2;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-chip{
  background:rgba(255,255,255,.14); border-radius:999px; padding:5px 12px;
  font-size:.8rem; font-weight:700;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-note{
  font-size:.8rem; opacity:.7; margin-top:12px; line-height:1.5; position:relative; z-index:2;
}
/* правая половина — лёгкий градиент в тон панели (C5) */
html[data-app-scope="trader"] body.tr-app .tr-lg2-right{
  flex:1; display:grid; place-items:center; padding:40px 26px; position:relative;
  background:linear-gradient(150deg,#dfe6ff 0%,#efe9ff 55%,#e6f2ff 100%);
  overflow:hidden;
}
/* цветные пятна за стеклом — сквозь карточку видно размытие */
html[data-app-scope="trader"] body.tr-app .tr-lg2-orb{
  position:absolute; border-radius:50%; pointer-events:none; filter:blur(6px);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-orb--1{
  width:340px; height:340px; left:50%; top:24%; transform:translateX(-72%);
  background:radial-gradient(circle, rgba(61,84,224,.42), transparent 66%);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-orb--2{
  width:300px; height:300px; left:50%; bottom:10%; transform:translateX(6%);
  background:radial-gradient(circle, rgba(123,92,240,.38), transparent 66%);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-orb--3{
  width:200px; height:200px; right:6%; top:8%;
  background:radial-gradient(circle, rgba(240,180,41,.35), transparent 66%);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-toolbar{
  position:absolute; top:16px; right:16px; display:flex; gap:8px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-form{ width:min(330px,100%); }
html[data-app-scope="trader"] body.tr-app .tr-lg2-greet{
  font-weight:800; font-size:1.3rem; color:var(--tr-text); margin-bottom:4px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-greet-sub{
  font-size:.85rem; color:var(--tr-muted); margin-bottom:20px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-form .form-row label{
  font-size:.72rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase;
  color:var(--tr-muted);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-form .form-row input{
  background:var(--tr-surface-2) !important; border:1px solid var(--tr-line) !important;
  border-radius:11px !important; padding:11px 13px !important;
  font-size:1rem !important; color:var(--tr-text) !important; width:100%;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-form .tr-lg2-totp{
  letter-spacing:.35em; text-align:center; font-variant-numeric:tabular-nums;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-form #tr-login-submit{
  width:100%; border:0 !important; border-radius:12px !important;
  padding:12px !important; font-weight:800 !important; font-size:1rem !important;
  color:#fff !important; cursor:pointer; margin-top:6px;
  background:linear-gradient(180deg,#5b71ee,#3d54e0) !important;
  box-shadow:0 6px 16px rgba(61,84,224,.35), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-form #tr-login-submit:hover{ transform:translateY(-1px); }
html[data-app-scope="trader"] body.tr-app .tr-lg2-form .tr-login-hint{
  text-align:center; font-size:.78rem; color:var(--tr-muted); margin-top:12px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2 .tr-login-error{
  background:var(--nb-red-2); color:var(--nb-red); border:0;
  border-radius:11px; padding:9px 12px; font-size:.8rem; margin-bottom:14px;
}
/* низкие окна: середина сворачивается, чтобы не появлялся скролл
   (!important — база flow/banks объявлена ниже по файлу, в блоке маскота) */
@media (max-height: 1150px){
  html[data-app-scope="trader"] body.tr-app .tr-lg2-cta{ display:none !important; }
}
@media (max-height: 1010px){
  html[data-app-scope="trader"] body.tr-app .tr-lg2-flow{ display:none !important; }
  html[data-app-scope="trader"] body.tr-app .tr-lg2-hero{ flex:1; }
}
@media (max-height: 880px){
  html[data-app-scope="trader"] body.tr-app .tr-lg2-boost{ display:none !important; }
  html[data-app-scope="trader"] body.tr-app .tr-lg2-copytop{ margin-top:12px; }
  html[data-app-scope="trader"] body.tr-app .tr-bug-scene{ min-height:150px; }
}
@media (max-width: 860px){
  html[data-app-scope="trader"] body.tr-app .tr-lg2-shell{ flex-direction:column; min-height:0; }
  html[data-app-scope="trader"] body.tr-app .tr-lg2-left{ width:100%; padding:24px; }
  html[data-app-scope="trader"] body.tr-app .tr-lg2-slogan{ font-size:1.15rem; }
  html[data-app-scope="trader"] body.tr-app .tr-lg2-hero{ align-items:flex-end; }
  html[data-app-scope="trader"] body.tr-app .tr-bug-scene{ flex-basis:36%; max-width:36%; min-height:130px; }
  html[data-app-scope="trader"] body.tr-app .tr-lg2-feats{ gap:8px; }
  html[data-app-scope="trader"] body.tr-app .tr-lg2-feat span:not(.tr-lg2-feat-ic){ display:none; }
  html[data-app-scope="trader"] body.tr-app .tr-lg2-note{ display:none; }
}
/* форма F3 в стекле (C5): матовая карточка с blur на светлом градиенте */
html[data-app-scope="trader"] body.tr-app .tr-f3-card{
  background:rgba(255,255,255,.55); border:1px solid rgba(255,255,255,.85);
  border-radius:20px; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  padding:24px 24px 20px; box-shadow:0 24px 54px rgba(61,84,224,.16);
  width:min(350px,100%);
}
html[data-app-scope="trader"] body.tr-app .tr-f3-card .form-row input{
  background:rgba(255,255,255,.75) !important;
  border-color:rgba(255,255,255,.9) !important;
}
html[data-app-scope="trader"] body.tr-app .tr-f3-greet{
  font-size:1.25rem; font-weight:800; color:var(--tr-text);
}
html[data-app-scope="trader"] body.tr-app .tr-f3-greet-sub{
  font-size:.84rem; color:var(--tr-muted); margin:3px 0 18px;
}
html[data-app-scope="trader"] body.tr-app .tr-f3-steps{
  display:flex; align-items:center; gap:8px; margin-bottom:20px;
}
html[data-app-scope="trader"] body.tr-app .tr-f3-step{
  display:flex; align-items:center; gap:7px;
  font-size:.8rem; font-weight:700; color:var(--tr-muted); white-space:nowrap;
}
html[data-app-scope="trader"] body.tr-app .tr-f3-step b{
  width:21px; height:21px; border-radius:50%; display:grid; place-items:center;
  font-size:.7rem; background:var(--tr-line); color:var(--tr-muted); flex:none;
}
html[data-app-scope="trader"] body.tr-app .tr-f3-step.on{ color:var(--tr-purple); }
html[data-app-scope="trader"] body.tr-app .tr-f3-step.on b{ background:var(--tr-purple); color:#fff; }
html[data-app-scope="trader"] body.tr-app .tr-f3-line{
  flex:1; height:2px; background:var(--tr-line); border-radius:2px;
}
html[data-app-scope="trader"] body.tr-app .tr-f3-passwrap{ position:relative; }
html[data-app-scope="trader"] body.tr-app .tr-f3-passwrap input{ padding-right:40px !important; }
html[data-app-scope="trader"] body.tr-app .tr-f3-eye{
  position:absolute; right:4px; top:50%; transform:translateY(-50%);
  width:30px !important; height:28px; border:0 !important; background:transparent !important;
  color:var(--tr-muted) !important; cursor:pointer; display:grid; place-items:center;
  box-shadow:none !important; padding:0 !important;
}
html[data-app-scope="trader"] body.tr-app .tr-f3-eye:hover,
html[data-app-scope="trader"] body.tr-app .tr-f3-eye.is-on{ color:var(--tr-purple) !important; }
html[data-app-scope="trader"] body.tr-app .tr-f3-caps{
  display:flex; align-items:center; gap:7px; background:var(--nb-amber-2); color:#7d5407;
  border-radius:10px; padding:7px 11px; font-size:.78rem; margin:-4px 0 13px;
}
html[data-app-scope="trader"] body.tr-app .tr-f3-caps[hidden]{ display:none; }
/* (поля формы стеклянной карточки заданы выше, в блоке C5) */
/* верх панели: слоган + описание сразу под логотипом */
html[data-app-scope="trader"] body.tr-app .tr-lg2-copytop{
  position:relative; z-index:2; margin-top:22px; max-width:520px;
}

/* CTA-манифест: крупная типографика для высоких экранов */
html[data-app-scope="trader"] body.tr-app .tr-lg2-cta{
  position:relative; z-index:2; margin-top:26px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-cta-line{
  font-size:clamp(1.5rem, 2.4vh, 2.1rem); font-weight:800; line-height:1.22;
  color:#fff; letter-spacing:-.01em;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-cta-line em{
  font-style:normal; background:linear-gradient(90deg,#ffe17a,#f0b429);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-cta-sub{
  margin:12px 0 0; max-width:440px;
  font-size:.86rem; line-height:1.55; color:rgba(255,255,255,.72);
}

/* таймлайн «как проходит заявка» — заполняет середину панели */
html[data-app-scope="trader"] body.tr-app .tr-lg2-flow{
  flex:1; display:flex; flex-direction:column; justify-content:center;
  gap:0; position:relative; z-index:2; margin:14px 0 4px; min-height:0;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-flow-cap{
  font-size:.66rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.55); margin-bottom:12px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-step{
  display:flex; gap:12px; align-items:flex-start; position:relative;
  padding:0 0 16px 0;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-step::before{
  content:""; position:absolute; left:13px; top:28px; bottom:-2px; width:2px;
  background:linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,.12));
  border-radius:2px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-step--last{ padding-bottom:0; }
html[data-app-scope="trader"] body.tr-app .tr-lg2-step--last::before{ display:none; }
html[data-app-scope="trader"] body.tr-app .tr-lg2-step b{
  width:27px; height:27px; border-radius:50%; flex:none; position:relative; z-index:1;
  display:grid; place-items:center; font-size:.72rem; font-weight:800;
  background:rgba(255,255,255,.16); color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-step--last b{
  background:linear-gradient(135deg,#ffe17a,#f0b429); color:#7a5a08;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-step i{
  display:block; font-style:normal; font-size:.84rem; font-weight:700; color:#fff;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-step span{
  display:block; font-size:.72rem; color:rgba(255,255,255,.6); margin-top:1px;
}

/* плашка Turbo Boost внизу панели */
html[data-app-scope="trader"] body.tr-app .tr-lg2-boost{
  display:flex; gap:12px; align-items:center;
  position:relative; z-index:3; margin:12px 0 2px;
  padding:12px 14px; border-radius:14px;
  background:linear-gradient(120deg, rgba(255,225,122,.16), rgba(255,255,255,.08));
  border:1px solid rgba(255,225,122,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-boost-ic{
  width:38px; height:38px; border-radius:12px; flex:none;
  display:grid; place-items:center; font-size:1.15rem;
  background:linear-gradient(135deg,#ffe17a,#f0b429);
  box-shadow:0 4px 12px rgba(240,180,41,.4);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-boost-body b{
  display:block; font-size:.88rem; color:#ffe9a8; letter-spacing:.02em;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-boost-body span{
  display:block; font-size:.76rem; line-height:1.45; color:rgba(255,255,255,.75); margin-top:2px;
}

/* полоса банков над подписью */
html[data-app-scope="trader"] body.tr-app .tr-lg2-banks{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  position:relative; z-index:3; margin:10px 0 8px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-banks-cap{
  font-size:.66rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.55);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-banks-row{
  display:inline-flex; gap:6px; align-items:center;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-bank{
  width:28px; height:28px; border-radius:9px; background:rgba(255,255,255,.92);
  display:grid; place-items:center; overflow:hidden;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-bank img{ border-radius:4px; display:block; }
html[data-app-scope="trader"] body.tr-app .tr-lg2-banks-more{
  font-size:.7rem; font-weight:800; color:rgba(255,255,255,.75); margin-left:2px;
}

/* герой-зона панели: жук слева у низа, фичи справа */
html[data-app-scope="trader"] body.tr-app .tr-lg2-hero{
  display:flex; align-items:flex-end; gap:6px;
  position:relative; z-index:2; min-height:0; margin-top:10px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-copy{
  flex:1; min-width:0; padding-bottom:14px; position:relative; z-index:3;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-slogan em{
  font-style:normal; background:linear-gradient(90deg,#ffe17a,#f0b429);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-about{
  margin:10px 0 0; font-size:.86rem; line-height:1.55; color:rgba(255,255,255,.78);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-feats{
  display:flex; flex-direction:column; gap:10px; margin-top:14px;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-feat{
  display:flex; gap:11px; align-items:flex-start;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-feat-ic{
  width:34px; height:34px; border-radius:11px; flex:none;
  display:grid; place-items:center; font-size:1rem;
  background:rgba(255,255,255,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-feat b{
  display:block; font-size:.84rem; color:#fff;
}
html[data-app-scope="trader"] body.tr-app .tr-lg2-feat span:not(.tr-lg2-feat-ic){
  display:block; font-size:.74rem; line-height:1.45; color:rgba(255,255,255,.66); margin-top:2px;
}

/* маскот-жук: сцена прижата к левому-нижнему углу героя */
html[data-app-scope="trader"] body.tr-app .tr-bug-scene{
  position:relative; z-index:2; flex:0 0 44%; max-width:44%;
  align-self:flex-end; margin-bottom:-10px; margin-left:-14px;
  display:grid; place-items:end center; min-height:200px;
}
/* мягкое свечение за жуком */
html[data-app-scope="trader"] body.tr-app .tr-bug-glow{
  position:absolute; left:50%; bottom:4%; transform:translateX(-50%);
  width:120%; aspect-ratio:1; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle, rgba(255,255,255,.14) 0%, rgba(255,255,255,.05) 45%, transparent 68%);
}
html[data-app-scope="trader"] body.tr-app .tr-bug-wrap{
  position:relative; width:100%; max-width:300px;
  transform:translate(var(--bug-px,0), var(--bug-py,0));
  transition:transform .35s ease-out;
  animation:tr-bug-bob 4.2s ease-in-out infinite;
}
@keyframes tr-bug-bob{
  0%,100%{ margin-top:0; rotate:-.5deg; }
  50%{ margin-top:-14px; rotate:.7deg; }
}
html[data-app-scope="trader"] body.tr-app .tr-bug-img{
  width:100%; display:block; user-select:none; pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,#000 88%,transparent 99.5%);
  mask-image:linear-gradient(180deg,#000 88%,transparent 99.5%);
  filter:drop-shadow(0 16px 26px rgba(8,12,44,.35));
}
html[data-app-scope="trader"] body.tr-app .tr-bug-img[hidden]{ display:none; }
/* монета из лап — отдельный спрайт, жук её подкидывает (в покое лежит поверх нарисованной) */
html[data-app-scope="trader"] body.tr-app .tr-bug-coin{
  position:absolute; left:50.2%; top:40.9%; width:24.5%; pointer-events:none;
  animation:tr-bug-toss 4.6s ease-in-out infinite;
  will-change:transform;
}
@keyframes tr-bug-toss{
  0%,48%{ transform:translateY(0) rotate(0) scale(1.04); }
  52%{ transform:translateY(4%) rotate(-14deg) scale(1.04); }     /* замах */
  62%{ transform:translateY(-150%) rotate(380deg) scale(1.04); }  /* подброс с вращением */
  71%{ transform:translateY(0) rotate(720deg) scale(1.04); }      /* поймал */
  74%{ transform:translateY(3%) rotate(720deg) scale(1.12,0.94); }/* пружинит в лапе */
  78%,100%{ transform:translateY(0) rotate(720deg) scale(1.04); }
}
/* искры в момент ловли монеты (синхронизированы с tr-bug-toss) */
html[data-app-scope="trader"] body.tr-app .tr-bug-spark{
  position:absolute; left:61%; top:50%; width:7px; height:7px; border-radius:50%;
  background:radial-gradient(circle,#fff7d6,#ffd640 70%); pointer-events:none; opacity:0;
  box-shadow:0 0 8px rgba(255,214,64,.9);
  animation:tr-bug-spark 4.6s ease-out infinite;
}
html[data-app-scope="trader"] body.tr-app .tr-bug-spark--1{ --sx:-46px; --sy:-30px; }
html[data-app-scope="trader"] body.tr-app .tr-bug-spark--2{ --sx:44px; --sy:-24px; animation-delay:.06s; }
html[data-app-scope="trader"] body.tr-app .tr-bug-spark--3{ --sx:-30px; --sy:34px; animation-delay:.1s; }
html[data-app-scope="trader"] body.tr-app .tr-bug-spark--4{ --sx:38px; --sy:30px; animation-delay:.14s; }
@keyframes tr-bug-spark{
  0%,70%{ opacity:0; transform:translate(0,0) scale(.3); }
  73%{ opacity:1; transform:translate(calc(var(--sx)*.4), calc(var(--sy)*.4)) scale(1.1); }
  82%,100%{ opacity:0; transform:translate(var(--sx), var(--sy)) scale(.2); }
}
/* блеск, пробегающий по жуку (обрезан по контуру маской-картинкой) */
html[data-app-scope="trader"] body.tr-app .tr-bug-sheen{
  position:absolute; inset:0; pointer-events:none; mix-blend-mode:screen;
  -webkit-mask-image:url("/ui/bug-mascot.png?v=20260704062000");
  mask-image:url("/ui/bug-mascot.png?v=20260704062000");
  -webkit-mask-size:100% 100%; mask-size:100% 100%;
  background:linear-gradient(115deg, transparent 42%, rgba(255,255,255,.30) 50%, transparent 58%);
  background-size:260% 100%; background-position:-160% 0;
  animation:tr-bug-sheen 8s ease-in-out infinite;
}
@keyframes tr-bug-sheen{
  0%,62%{ background-position:-160% 0; }
  80%,100%{ background-position:180% 0; }
}
/* пульсирующая тень под жуком */
html[data-app-scope="trader"] body.tr-app .tr-bug-shadow{
  position:absolute; left:50%; bottom:6%; transform:translateX(-50%);
  width:46%; height:26px; border-radius:50%;
  background:rgba(8,12,44,.4); filter:blur(9px);
  animation:tr-bug-shadow 4.2s ease-in-out infinite; pointer-events:none;
}
@keyframes tr-bug-shadow{
  0%,100%{ transform:translateX(-50%) scale(1); opacity:.65; }
  50%{ transform:translateX(-50%) scale(.8); opacity:.4; }
}
/* падающие монетки на фоне */
html[data-app-scope="trader"] body.tr-app .tr-bug-fall{
  position:absolute; top:-8%; width:26px; height:26px; border-radius:50%;
  display:grid; place-items:center; font-size:15px; font-weight:800; color:#a67c12;
  background:radial-gradient(circle at 35% 30%, #ffe17a, #f0b429 70%);
  box-shadow:inset 0 0 0 2px #d9a020, 0 2px 6px rgba(8,12,44,.3);
  opacity:0; pointer-events:none;
  animation:tr-bug-fall 6.5s linear infinite;
}
html[data-app-scope="trader"] body.tr-app .tr-bug-fall--1{ left:14%; }
html[data-app-scope="trader"] body.tr-app .tr-bug-fall--2{ left:50%; animation-delay:2.2s; }
html[data-app-scope="trader"] body.tr-app .tr-bug-fall--3{ left:82%; animation-delay:4.4s; }
@keyframes tr-bug-fall{
  0%{ transform:translateY(0) rotate(0); opacity:0; }
  10%{ opacity:.9; }
  78%{ opacity:.9; }
  100%{ transform:translateY(46vh) rotate(320deg); opacity:0; }
}
@media (prefers-reduced-motion: reduce){
  html[data-app-scope="trader"] body.tr-app .tr-bug-wrap,
  html[data-app-scope="trader"] body.tr-app .tr-bug-coin,
  html[data-app-scope="trader"] body.tr-app .tr-bug-spark,
  html[data-app-scope="trader"] body.tr-app .tr-bug-sheen,
  html[data-app-scope="trader"] body.tr-app .tr-bug-shadow,
  html[data-app-scope="trader"] body.tr-app .tr-bug-fall{ animation:none; }
  html[data-app-scope="trader"] body.tr-app .tr-bug-fall,
  html[data-app-scope="trader"] body.tr-app .tr-bug-spark{ display:none; }
}
@media (max-width: 860px){
  html[data-app-scope="trader"] body.tr-app .tr-bug-scene{ min-height:170px; }
  html[data-app-scope="trader"] body.tr-app .tr-bug-wrap{ width:min(200px,58%); }
}
/* тема «Графит»: тумблер светлая/тёмная доступен в кабинете трейдера */
html[data-app-scope="trader"] .tr-theme-toggle{ display:inline-flex !important; }
/* /вход LG2 */