/* «Акцент» — последний слой темы. Белый фон, светло-серые кнопки с чёткой рамкой и голубым значком, голубой — только у
   главного: основная кнопка, активный пункт меню, карточка баланса. Голубой всегда плавный, в три ступени
   (светлый → основной → глубокий). Карточки баланса — как банковская карта: глубокий сине-голубой градиент, справа —
   полупрозрачные логотипы криптовалют (img/crypto-deco.svg), рядом объёмный кошелёк с монетой Tether (ui/art3d.js → WalletArt). */
:root {
  --sp-void: #ffffff; --sp-hull: #ffffff; --sp-panel: #f4f6f9; --sp-panel2: #eaeef4;
  --sp-line: rgba(15, 23, 42, 0.06); --sp-line2: rgba(15, 23, 42, 0.1); --sp-btn-line: rgba(15, 23, 42, 0.11);
  --sp-star: #1f2a3c; --sp-dust: #69758a; --sp-faint: #a3adbc;
  --sp-blue: #2f7cf6; --sp-blue-hi: #6aacff; --sp-blue-lo: #1d55d0;
  --sp-blue-grad: linear-gradient(135deg, #63a8ff 0%, #2f7cf6 50%, #1d55d0 100%);
  --sp-ion: #2f7cf6; --sp-ion-soft: rgba(47, 124, 246, 0.09); --sp-ion-line: rgba(47, 124, 246, 0.32); --sp-on-ion: #ffffff;
  --sp-hero: linear-gradient(145deg, #172540 0%, #1d3d82 52%, #2d72e6 100%);
  --sp-ink: #1d2a44;
  --sp-shadow: none; --sp-shadow-float: 0 16px 36px -22px rgba(15, 23, 42, 0.35);
  --sp-blue-shadow: 0 8px 18px -12px rgba(47, 124, 246, 0.75);
}
html[data-theme="dark"], [data-theme="dark"] {
  --sp-void: #080808; --sp-hull: #101010; --sp-panel: #151515; --sp-panel2: #202020;
  --sp-line: rgba(148, 163, 184, 0.07); --sp-line2: rgba(148, 163, 184, 0.12); --sp-btn-line: rgba(148, 163, 184, 0.17);
  --sp-star: #dde3ec; --sp-dust: #8995a7; --sp-faint: #586375;
  --sp-blue: #4a8cff; --sp-blue-grad: linear-gradient(135deg, #6eaaff 0%, #3f80f6 50%, #2457cc 100%);
  --sp-ion: #5b97ff; --sp-ion-soft: rgba(91, 151, 255, 0.12); --sp-ion-line: rgba(91, 151, 255, 0.36); --sp-on-ion: #ffffff;
  --sp-hero: linear-gradient(145deg, #111b2f 0%, #183465 52%, #2657c2 100%);
  --sp-ink: #1d2738; --sp-shadow: none; --sp-blue-shadow: 0 8px 18px -12px rgba(30, 90, 220, 0.8);
}
body { background: var(--sp-void); }
.sp-top, body.scrolled .sp-top { background: color-mix(in srgb, var(--sp-void) 92%, transparent); }

/* ── карточки баланса: банковская карта с монограммой ── */
:is(.hm-bal, .wl-hero, .dp-hero, .pn-hero, .pn-bal, .rf-hero, .sp-wave-card, .wf-dep-hero, .wf-res-hero) {
  position: relative; isolation: isolate; overflow: hidden; color: #f3f7ff;
  background: var(--sp-hero);
  box-shadow: 0 18px 40px -26px rgba(29, 85, 208, 0.55), inset 0 0 0 1px rgba(255, 255, 255, 0.06);
  --sp-ink-dim: rgba(225, 234, 255, 0.7); --sp-on-ink: #f3f7ff;
}
html[data-theme="dark"] :is(.hm-bal, .wl-hero, .dp-hero, .pn-hero, .pn-bal, .rf-hero, .sp-wave-card) { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
/* мягкий световой блик в верхнем углу — третий тон градиента, без анимации */
:is(.hm-bal, .wl-hero, .dp-hero)::after { content: ""; position: absolute; z-index: -1; right: -30%; top: -40%; width: 80%; height: 90%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(140, 190, 255, 0.28), transparent); pointer-events: none; }
:is(.hm-bal, .wl-hero, .dp-hero) .sp-h2, .wl-label, .dp-label { color: var(--sp-ink-dim); }
.hm-bal-t { align-items: center; }
.hm-bal-art, .wl-art { flex: none; margin: -10px -6px -14px 0; }
.wl-main { align-items: center; }
.wl-main-l { min-width: 0; }
/* сумма с монетой Tether */
.sp-usdt { display: inline-block; flex: none; vertical-align: middle; border-radius: 50%; }
.sp-usdt.lg { margin: 0 10px 0 0; position: relative; top: -3px; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.85); }
.hm-bal-n, .wl-bal, .dp-total { display: flex; align-items: center; white-space: nowrap; }
.hm-bal-n small, .wl-bal small, .dp-total small { align-self: flex-end; margin-bottom: 6px; }
.wl-bal small { background: rgba(255, 255, 255, 0.1); }
.sp-stat-v .sp-usdt { width: 16px; height: 16px; margin-right: 6px; position: relative; top: -1px; }
.sp-stat-v { display: inline-flex; align-items: center; }
/* кнопки внутри карточки баланса: главная — белая с голубым текстом, вторая — стеклянная с рамкой */
html[data-theme] :is(.hm-bal, .wl-hero, .dp-hero, .pn-hero, .pn-bal, .rf-hero) .sp-btn.primary { background: #ffffff; color: #1d55d0; box-shadow: 0 8px 18px -12px rgba(0, 0, 0, 0.5); }
html[data-theme] :is(.hm-bal, .wl-hero, .dp-hero, .pn-hero, .pn-bal, .rf-hero) .sp-btn.ghost { background: rgba(255, 255, 255, 0.1); color: #f3f7ff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.24); }
.wl-res, .wl-addr { background: rgba(255, 255, 255, 0.09); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14); }
.wl-net { background: rgba(255, 255, 255, 0.1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14); color: #e8efff; }
.wl-hero .sp-iconbtn { color: #e8efff; background: rgba(255, 255, 255, 0.1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16); }
.wl-res-bar u { background: #8be0bd; }
.dp-act { background: rgba(255, 255, 255, 0.1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.24); color: #f3f7ff; }
.dp-act.primary { background: #ffffff; color: #1d55d0; box-shadow: none; }
.dp-act:disabled { opacity: 0.45; }
.dp-tag, .dp-rate { color: #e8efff; }
.dp-split { background: rgba(139, 224, 189, 0.55); }

/* ── кнопки: всегда чёткие — фон, рамка, голубой значок; главная — голубой градиент ── */
.sp-btn { border-radius: 16px; font-weight: 600; }
.sp-btn.primary { background: var(--sp-blue-grad); color: #fff; box-shadow: var(--sp-blue-shadow); }
.sp-btn.primary:hover:not(:disabled) { filter: brightness(1.04); background: var(--sp-blue-grad); }
.sp-btn.primary:disabled { background: var(--sp-panel2); color: var(--sp-faint); box-shadow: inset 0 0 0 1px var(--sp-btn-line); opacity: 1; }
html[data-theme="dark"] .sp-btn.primary { background: var(--sp-blue-grad); color: #fff; }
html[data-theme="dark"] .sp-btn.primary:disabled { background: var(--sp-panel2); color: var(--sp-faint); }
.sp-btn.ghost { background: var(--sp-panel); color: var(--sp-star); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-btn.ghost .sp-ico { color: var(--sp-ion); }
.sp-btn.danger { box-shadow: 0 8px 18px -12px rgba(194, 73, 63, 0.7); }
/* круглые действия кошелька и быстрые действия главной: светло-серая плашка, рамка, голубой значок */
.wl-circ, .sp-quick-i .sp-ico { background: var(--sp-panel); color: var(--sp-ion); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.wl-circ.primary { background: var(--sp-blue-grad); color: #fff; box-shadow: var(--sp-blue-shadow); }
html[data-theme="dark"] .wl-circ.primary { background: var(--sp-blue-grad); }
.wl-act b, .sp-quick-i { color: var(--sp-star); font-weight: 500; }
.wl-act:active .wl-circ, .sp-quick-i:active .sp-ico { transform: scale(0.94); }
/* карточка «Депозитный счёт» и любые карточки-кнопки — с рамкой, чтобы читались как кнопка */
.wl-dep, .sp-row-btn, .sp-advice-open, .nw-pick, .wf-person, .ts-row.card { background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.wl-dep .dp-ico[class] { background: var(--sp-hull); color: var(--sp-ion); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-row-btn .sp-ico:last-child, .wl-dep > .sp-ico:last-child { color: var(--sp-ion); }
/* иконки-кнопки: круглые, с рамкой; «Назад» — голубая стрелка */
.sp-iconbtn { border-radius: 50%; background: var(--sp-panel); color: var(--sp-star); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-iconbtn:active { background: var(--sp-panel2); }
.sp-top .sp-iconbtn { width: 38px; height: 38px; }
.sp-top .sp-iconbtn[aria-label="Назад"] { color: var(--sp-ion); background: var(--sp-ion-soft); box-shadow: inset 0 0 0 1px var(--sp-ion-line); }
.sp-top .sp-iconbtn[aria-label="Назад"] .sp-ico { margin-left: -2px; }
.sp-sheet-x[class] { background: var(--sp-panel); color: var(--sp-star); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
/* ссылки-действия — не голый текст, а маленькие кнопки-«таблетки» */
.sp-link { padding: 6px 12px; border-radius: 999px; background: var(--sp-ion-soft); color: var(--sp-ion); font: 550 13px/1.2 var(--sp-body); box-shadow: inset 0 0 0 1px var(--sp-ion-line); }
.sp-link .sp-ico { margin-right: -3px; }
.sp-stat-h .sp-link, .sp-section-head .sp-link, .dp-link { padding: 6px 12px; }
.dp-link { border-radius: 999px; background: var(--sp-ion-soft); color: var(--sp-ion); font: 550 13px/1.2 var(--sp-body); box-shadow: inset 0 0 0 1px var(--sp-ion-line); }
/* чипы, сегменты, переключатели */
.sp-chip { background: var(--sp-panel); color: var(--sp-dust); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-chip.on, html[data-theme="dark"] .sp-chip.on { background: var(--sp-ion-soft); color: var(--sp-ion); box-shadow: inset 0 0 0 1.5px var(--sp-ion-line); }
.wl-filter .sp-chip { background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.wl-filter .sp-chip.on { background: var(--sp-ion-soft); color: var(--sp-ion); box-shadow: inset 0 0 0 1.5px var(--sp-ion-line); }
.sp-seg { background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-seg button[aria-pressed="true"], html[data-theme="dark"] .sp-seg button[aria-pressed="true"] { background: var(--sp-hull); color: var(--sp-ion); box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08), inset 0 0 0 1px var(--sp-ion-line); }
.sp-switch.on { background: var(--sp-blue-grad); }
/* нижнее меню: белая панель с рамкой, активный пункт — голубой градиент */
.sp-nav { background: color-mix(in srgb, var(--sp-hull) 94%, transparent); box-shadow: inset 0 0 0 1px var(--sp-btn-line), 0 12px 30px -20px rgba(15, 23, 42, 0.35); }
.sp-nav-item.on, html[data-theme="dark"] .sp-nav-item.on { background: var(--sp-blue-grad); color: #fff; box-shadow: var(--sp-blue-shadow); }
.sp-nav-item:not(.on) { color: var(--sp-dust); }

/* ── карточки на белом: светло-серые без теней ── */
.sp-card, .sp-stat, .sp-dirs.list, .ts-guard, .nw-adm, .wl-wd, .dp-lot, .sp-svcw, .sp-tile, .sp-kpi { background: var(--sp-panel); box-shadow: none; }
.sp-dirs.list .sp-svcw { background: none; }
.sp-stat-ico, .sp-svcw .sp-ava[class], .ts-ava { background: var(--sp-hull); color: var(--sp-ion); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-stat-ico.pos { background: var(--sp-aurora-soft); color: var(--sp-aurora); box-shadow: none; }
.sp-stat-ico.warn { background: var(--sp-nova-soft); color: var(--sp-nova); box-shadow: none; }
.sp-stat-r + .sp-stat-r::before, .sp-dirs.list .sp-svcw + .sp-svcw::after, .ts-person + .ts-person::before { background: var(--sp-line2); }
.sp-stat-go { color: var(--sp-ion); }
.sp-composer { background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-composer:focus-within { box-shadow: inset 0 0 0 1.5px var(--sp-ion-line), 0 0 0 4px var(--sp-ion-soft); }
.sp-send { background: var(--sp-blue-grad); color: #fff; }
.sp-send:disabled { background: var(--sp-panel2); color: var(--sp-faint); }
.sp-bubble, .sp-dlg-m.out { background: var(--sp-blue-grad); color: #fff; }
.sp-dlg-m.out small { color: rgba(255, 255, 255, 0.72); }
.sp-dlg-m.in { background: var(--sp-panel); box-shadow: none; }

/* ── поля: светло-серые с тонкой рамкой, голубой фокус ── */
.sp-field, .wf-search, .nw-amt, .wl-amt { background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-field:focus, .sp-sheet .sp-field:focus { background: var(--sp-hull); box-shadow: inset 0 0 0 1.5px var(--sp-ion), 0 0 0 4px var(--sp-ion-soft); }
.wf-search:focus-within, .nw-amt:focus-within, .wl-amt:focus-within { box-shadow: inset 0 0 0 1.5px var(--sp-ion), 0 0 0 4px var(--sp-ion-soft); }

/* ── шторки: белые ── */
.sp-sheet { background: var(--sp-hull); }
.sp-sheet-body > :is(.sp-btn-row, .sp-btn.wide):last-child { box-shadow: 0 -14px 14px -2px var(--sp-hull); }
.sp-sheet-body > .sp-btn-row:last-child { background: var(--sp-hull); }
.sp-sheet .nw-item { background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-sheet .nw-item.on { background: var(--sp-ion-soft); box-shadow: inset 0 0 0 1.5px var(--sp-ion); }

/* ── строки «подпись — значение»: без точек-выносок, с разделителем и плотным значением ── */
.sp-kv { padding: 11px 0; align-items: center; }
.sp-kv + .sp-kv { box-shadow: 0 -1px 0 var(--sp-line2); }
.sp-kv i { display: none; }
.sp-kv-l { flex: 1; font-size: 14px; }
.sp-kv-v { font-weight: 600; color: var(--sp-star); font-variant-numeric: tabular-nums; }
.sp-kvs { display: grid; padding: 4px 16px; border-radius: 20px; background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-line); }

.wf-burst { width: 100%; max-width: 320px; isolation: isolate; }
.sp-empty { position: relative; isolation: isolate; }

/* ── 3D-кошелёк: монета плавно «дышит» вверх-вниз ── */
.wa { display: block; overflow: visible; filter: drop-shadow(0 10px 14px rgba(8, 24, 64, 0.28)); }
.wa-coin { animation: wa-float 4.8s cubic-bezier(0.45, 0, 0.55, 1) infinite; transform-origin: 96px 26px; }
@keyframes wa-float { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-3px) rotate(-6deg); } }
@media (prefers-reduced-motion: reduce) { .wa-coin { animation: none; } }
html.lite .wa-coin { animation: none; }

/* ── плавные переходы экранов и нажатий ── */
.sp-btn, .wl-circ, .sp-iconbtn, .sp-chip, .sp-link, .sp-nav-item { transition: transform 200ms var(--sp-ease-out, ease), background 260ms ease, box-shadow 260ms ease, color 200ms ease; }
@media (max-width: 380px) { .hm-bal-art .wa, .wl-art .wa { width: 78px; height: 67px; } }

/* лента кошелька: операции дня — одной карточкой с разделителями, сумма с цветом и значком */
.wl-ops { display: grid; padding: 4px 6px; border-radius: 22px; background: var(--sp-panel); }
.wl-ops .wl-op { width: 100%; margin: 0; padding: 11px 10px; border-radius: 16px; position: relative; }
.wl-ops .wl-op + .wl-op::before { content: ""; position: absolute; top: 0; left: 62px; right: 10px; height: 1px; background: var(--sp-line2); }
.wl-ops .wl-op:active { background: var(--sp-panel2); }
.wl-op .sp-ava[class] { background: var(--sp-hull); color: var(--sp-ion); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.wl-op-v { font-weight: 650; }
.sp-hist-day { margin: 16px 4px 8px; }
/* диаграмма и легенда: цвета сервисов — оттенки голубого, значения жирные */
:root, html[data-theme="dark"] { --sp-trade: #2f7cf6; --sp-nft: #6f8ff8; --sp-escort: #9ab6fb; --sp-amazon: #c1d3fb; }
.sp-legend-row { padding: 8px 12px; border-radius: 12px; background: var(--sp-hull); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.sp-legend-row .sp-num { color: var(--sp-star); font-weight: 600; }
.sp-kvs .sp-kv + .sp-kv { box-shadow: 0 -1px 0 var(--sp-line2); }

/* значки в кружках (IconAva, аватары сервисов): белый кружок, рамка, голубой знак */
.sp-ava[class] { background: var(--sp-hull); color: var(--sp-ion); box-shadow: inset 0 0 0 1px var(--sp-btn-line); }
.st-row > .sp-ico:last-child, .sp-card .sp-row-btn > .sp-ico:last-child { color: var(--sp-ion); }
/* вкладки панели: чёткие «таблетки» с рамкой; активная — голубой градиент */
.pn-tab { background: var(--sp-panel); color: var(--sp-star); box-shadow: inset 0 0 0 1px var(--sp-btn-line); font-weight: 550; }
.pn-tab.on { background: var(--sp-blue-grad); color: #fff; box-shadow: var(--sp-blue-shadow); }
.pn-tabs { gap: 6px; }
/* быстрые кнопки направлений в панели — светло-серые с рамкой */
.pn-svc-a { background: var(--sp-hull) !important; box-shadow: inset 0 0 0 1px var(--sp-btn-line) !important; color: var(--sp-star); }
.pn-svc-a .sp-ico { color: var(--sp-ion); }
.pn-svcs .pn-svc { background: none; }
.sp-svcw::before { display: none; }
html[data-theme="dark"] :is(.hm-bal, .wl-hero, .dp-hero, .pn-hero, .pn-bal, .rf-hero, .sp-wave-card, .wf-dep-hero, .wf-res-hero, .sp-kpi.ink) {
  background: var(--sp-hero); }

/* профиль: карточка кошелька — та же «банковская карта», что на главной */
.pf-wallet { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; gap: 8px; width: 100%; padding: 18px 18px 18px 20px; border-radius: 26px; text-align: left; color: #f3f7ff;
  background: var(--sp-hero); box-shadow: 0 18px 40px -26px rgba(29, 85, 208, 0.55); transition: transform 200ms ease; }
.pf-wallet:active { transform: scale(0.99); }
.pf-wallet-l { flex: 1; min-width: 0; display: grid; gap: 8px; justify-items: start; }
.pf-wallet-t { font: 500 13px/1.2 var(--sp-body); color: rgba(225, 234, 255, 0.72); }
.pf-wallet-n { display: flex; align-items: center; font: 650 30px/1 var(--sp-display); letter-spacing: -0.04em; }
.pf-wallet-n small { margin-left: 8px; font: 600 11px/1 var(--sp-body); letter-spacing: 0.08em; color: rgba(225, 234, 255, 0.7); align-self: flex-end; margin-bottom: 4px; }
.pf-wallet-chip { padding: 5px 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16); font: 500 12px/1.2 var(--sp-body); }
.pf-wallet-art { flex: none; margin: -8px -4px -10px 0; }
/* счётчики и пометки в заголовках разделов — «таблетка», а не голый текст */
.sp-section-head > span:not(.sp-grow):not(.sp-h2), .sp-stat-h > span:not(.sp-h2) { padding: 4px 10px; border-radius: 999px; background: var(--sp-panel); box-shadow: inset 0 0 0 1px var(--sp-btn-line); font: 550 12.5px/1.2 var(--sp-body); color: var(--sp-star); }
.sp-steps .sp-num, .lt-step-n, .sp-step-n { background: var(--sp-ion-soft); color: var(--sp-ion); }
.rf-step-i { background: var(--sp-hull) !important; color: var(--sp-ion) !important; box-shadow: inset 0 0 0 1.5px var(--sp-ion-line) !important; } .rf-steps li.done .rf-step-i, .rf-steps li.now .rf-step-i { background: var(--sp-blue-grad) !important; color: #fff !important; box-shadow: none !important; }

/* ── украшение карточек баланса: четыре официальных логотипа — Tether, Bitcoin, Ethereum, BNB (img/crypto-deco.svg,
   cryptocurrency-icons, CC0). Без повтора, только в правой части; к левому краю плавно растворяется — сумма читается чисто. ── */
html[data-theme] :is(.hm-bal, .wl-hero, .dp-hero, .pn-hero, .pn-bal, .rf-hero, .sp-wave-card, .wf-dep-hero, .wf-res-hero, .pf-wallet, .sp-kpi.ink)::before {
  content: ""; display: block; position: absolute; inset: 0; width: auto; height: auto; z-index: -1; pointer-events: none; opacity: 1; animation: none;
  background: url("/assets/ea4a990c07fe852ddea8/space/img/crypto-deco.svg") right -18px top -14px / 240px 240px no-repeat;
  -webkit-mask-image: linear-gradient(to left, #000 0%, rgba(0, 0, 0, 0.6) 30%, transparent 62%);
  mask-image: linear-gradient(to left, #000 0%, rgba(0, 0, 0, 0.6) 30%, transparent 62%); }

/* ── больше «карточек как в депозите»: сумма вывода и операции, депозиты, страж кассы ──
   Тот же сине-голубой градиент и полупрозрачные логотипы справа. Цвета внутри — светлые: токены переопределены локально. */
:is(.wl-sum, .dp-close, .dp-lot, .ts-guard) {
  position: relative; isolation: isolate; overflow: hidden; padding: 18px 18px 18px 20px; border-radius: 24px; color: #f3f7ff;
  background: var(--sp-hero); box-shadow: 0 16px 36px -26px rgba(29, 85, 208, 0.6), inset 0 0 0 1px rgba(255, 255, 255, 0.06);
  --sp-star: #f3f7ff; --sp-dust: rgba(225, 234, 255, 0.72); --sp-faint: rgba(225, 234, 255, 0.45);
  --sp-panel: rgba(255, 255, 255, 0.08); --sp-panel2: rgba(255, 255, 255, 0.11); --sp-hull: rgba(255, 255, 255, 0.12);
  --sp-line: rgba(255, 255, 255, 0.12); --sp-line2: rgba(255, 255, 255, 0.18); --sp-btn-line: rgba(255, 255, 255, 0.22);
  --sp-ion: #d6e6ff; --sp-ion-soft: rgba(255, 255, 255, 0.12); --sp-ion-line: rgba(255, 255, 255, 0.28);
  --sp-aurora: #8be0bd; --sp-aurora-soft: rgba(139, 224, 189, 0.16); --sp-nova: #ffd59a; --sp-nova-soft: rgba(255, 213, 154, 0.16);
  --sp-flare: #ffb4ab; --sp-flare-soft: rgba(255, 180, 171, 0.16); --sp-ink: rgba(255, 255, 255, 0.92);
}
html[data-theme] :is(.wl-sum, .dp-close, .dp-lot, .ts-guard, .sp-kpi.ink)::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: url("/assets/ea4a990c07fe852ddea8/space/img/crypto-deco.svg") right -26px top -18px / 220px 220px no-repeat;
  -webkit-mask-image: linear-gradient(to left, #000 0%, rgba(0, 0, 0, 0.6) 30%, transparent 62%);
  mask-image: linear-gradient(to left, #000 0%, rgba(0, 0, 0, 0.6) 30%, transparent 62%); }
:is(.wl-sum, .dp-close, .dp-lot, .ts-guard) .sp-h2 { color: rgba(225, 234, 255, 0.72); }
.wl-sum-n, .dp-lot-main b { display: flex; align-items: center; color: #fff; }
.wl-sum-n.sp-pos { color: #8be0bd; }
.wl-sum .sp-ava[class], .dp-close .dp-ico[class] { background: rgba(255, 255, 255, 0.12); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2); }
.wl-sum .nw-token .nw-logo { box-shadow: 0 0 0 2px #1d3d82; }
.dp-lot { display: grid; gap: 10px; }
.dp-lot-id { color: #fff; font-weight: 600; } .dp-lot-day { color: rgba(225, 234, 255, 0.72); }
.dp-lot-gain { color: #8be0bd; }
.dp-lot-bar { background: rgba(255, 255, 255, 0.14); } .dp-lot-bar u { background: #8be0bd; }
.dp-lot-foot { color: rgba(225, 234, 255, 0.72); }
.dp-lot-close { justify-self: start; padding: 8px 14px; border-radius: 12px; background: rgba(255, 255, 255, 0.08); color: #ffd0ca; box-shadow: inset 0 0 0 1px rgba(255, 180, 171, 0.45); font: 550 13px/1.2 var(--sp-body); }
.dp-lots { display: grid; gap: 10px; }
.dp-lot-mode { color: rgba(225, 234, 255, 0.72); }
.dp-lot-btn { background: rgba(255, 255, 255, 0.1); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28); }
.ts-guard .sp-btn.ghost { background: rgba(255, 255, 255, 0.1); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.24); }
.ts-guard .sp-btn.primary { background: #fff; color: #1d55d0; }
.ts-flow > div { background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); }
.ts-meter i { background: #8be0bd; }
/* кошелёк: логотипы ниже, чтобы их не закрывал 3D-кошелёк */
html[data-theme] .wl .wl-hero.wl-hero::before { background-position: right -18px bottom -40px; }
.wl-sum-n small { margin-left: 6px; align-self: flex-end; margin-bottom: 5px; }
html[data-theme] :is(.wl-sum, .dp-close).wl-sum::before, html[data-theme] .dp-close.dp-close::before, html[data-theme] .wl-sum.wl-sum::before { background-position: right -30px center; }
