/* Doton DEX — светлая тема (включается атрибутом data-theme="light" на <html>, см. theme.js) */

/* кнопка переключения темы */
.theme-btn { flex: none; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.06); color: #fff; cursor: pointer; transition: background .2s, transform .2s; -webkit-tap-highlight-color: transparent; }
.theme-btn:hover { background: rgba(255,255,255,.12); }
.theme-btn:active { transform: scale(.92); }
.theme-btn svg { width: 19px; height: 19px; grid-area: 1 / 1; transition: opacity .3s, transform .4s cubic-bezier(.2,.8,.2,1); }
.theme-btn .ico-moon { opacity: 0; transform: rotate(-60deg) scale(.6); }
[data-theme="light"] .theme-btn .ico-sun { opacity: 0; transform: rotate(60deg) scale(.6); }
[data-theme="light"] .theme-btn .ico-moon { opacity: 1; transform: none; }
.top-right { display: flex; align-items: center; gap: 8px; }
.theme-slot { margin-left: auto; display: flex; align-items: center; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .35s; }

[data-theme="light"] {
  --bg: #f3f4f7; --card: #ffffff; --field: #f3f4f7; --line: rgba(0,0,0,.08);
  --text: #0d0e12; --muted: #6b7080; color-scheme: light;
}
[data-theme="light"] html, html[data-theme="light"] { background: #f3f4f7; }
[data-theme="light"] body, [data-theme="light"] body[data-view="portfolio"] { background: #f3f4f7; color: #0d0e12; }
[data-theme="light"] .theme-btn { background: #fff; border-color: rgba(0,0,0,.1); color: #0d0e12; }

/* фон: серые пятна темнее фона */
[data-theme="light"] .b1 { background: radial-gradient(closest-side, rgba(125,131,143,.55), rgba(125,131,143,0)); opacity: .8; }
[data-theme="light"] .b2 { background: radial-gradient(closest-side, rgba(150,155,165,.6), rgba(150,155,165,0)); opacity: .8; }
[data-theme="light"] .b3 { background: radial-gradient(closest-side, rgba(115,121,133,.4), rgba(115,121,133,0)); opacity: .6; }
[data-theme="light"] .floaters img { opacity: .5; }

/* заставка */
[data-theme="light"] .intro-bg { background: #f3f4f7; }
[data-theme="light"] .intro-text { color: #0d0e12; }

/* шапка, логотип, меню продуктов */
[data-theme="light"] .brand, [data-theme="light"] .brand #brandText { color: #0d0e12; }
[data-theme="light"] .brand:hover, [data-theme="light"] .brand[aria-expanded="true"] { background: rgba(0,0,0,.06); }
[data-theme="light"] .brand-menu { background: #fff; border-color: rgba(0,0,0,.08); box-shadow: 0 24px 60px -24px rgba(20,22,30,.35); }
[data-theme="light"] .bm-item:hover, [data-theme="light"] .bm-item.current { background: rgba(0,0,0,.04); }
[data-theme="light"] .bm-item i { background: rgba(0,0,0,.05); color: #3a3d45; }
[data-theme="light"] .bm-item:hover i, [data-theme="light"] .bm-item.current i { background: rgba(0,0,0,.08); color: #0d0e12; }
[data-theme="light"] .bm-item b { color: #0d0e12; }
[data-theme="light"] .bm-foot, [data-theme="light"] .bm-sections { border-color: rgba(0,0,0,.08); }
[data-theme="light"] .bm-foot a { color: #3a3d45; }
[data-theme="light"] .bm-foot a:hover, [data-theme="light"] .bm-sections a:hover { background: rgba(0,0,0,.05); color: #0d0e12; }
[data-theme="light"] .bm-sections a { color: #0d0e12; }
[data-theme="light"] .nav a:hover, [data-theme="light"] .nav a.on { color: #0d0e12; }
[data-theme="light"] .nav a.on { background: rgba(0,0,0,.06); }
[data-theme="light"] .icon-btn:hover, [data-theme="light"] .icon-btn[aria-expanded="true"] { background: rgba(0,0,0,.06); color: #0d0e12; }
[data-theme="light"] .price-chip { background: #fff; }

/* окно обмена */
[data-theme="light"] .swap { background: #fff; border-color: rgba(0,0,0,.07); box-shadow: 0 24px 50px -30px rgba(20,22,30,.3); }
[data-theme="light"] .swap .field, [data-theme="light"] .field, [data-theme="light"] .settings { background: #f3f4f7; }
[data-theme="light"] .field:focus-within { border-color: rgba(0,0,0,.12); }
[data-theme="light"] .f-mid input, [data-theme="light"] .f-mid .out { color: #0d0e12; }
[data-theme="light"] .f-mid input::placeholder, [data-theme="light"] .out.dim { color: #b3b7c0; }
[data-theme="light"] .bal.click:hover, [data-theme="light"] .pcts button:hover { color: #0d0e12; border-color: rgba(0,0,0,.25); }
[data-theme="light"] .token-btn { background: #fff; border-color: rgba(0,0,0,.08); color: #0d0e12; }
[data-theme="light"] .token-btn:hover { background: #ebedf1; }
[data-theme="light"] .token-btn img, [data-theme="light"] .t-ico { background: #e3e5ea; }
[data-theme="light"] .flip { background: #fff; border-color: #f3f4f7; color: #0d0e12; }
[data-theme="light"] .flip:hover { background: #ebedf1; }
[data-theme="light"] .flip-run rect { stroke: rgba(0,0,0,.35); }
[data-theme="light"] .d-row b, [data-theme="light"] .d-rate span:first-child { color: #0d0e12; }
[data-theme="light"] button.cta { background: #0d0e12; color: #fff; }
[data-theme="light"] button.cta:hover:not(:disabled) { background: #262830; }
[data-theme="light"] button.cta:disabled { background: #e7e9ee; color: #8a8fa0; }
[data-theme="light"] .powered { color: #8a8fa0; }
[data-theme="light"] .set-row button.on { background: #0d0e12; color: #fff; border-color: #0d0e12; }

/* выбор токена и окна */
[data-theme="light"] .modal { background: rgba(20,22,30,.3); }
[data-theme="light"] .modal-card { background: #fff; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .search, [data-theme="light"] .page-search { background: #fff; border-color: rgba(0,0,0,.1); color: #0d0e12; }
[data-theme="light"] .search:focus { border-color: rgba(0,0,0,.25); }
[data-theme="light"] .chip:hover, [data-theme="light"] .t-row:hover, [data-theme="light"] .t-row:focus-visible { background: rgba(0,0,0,.05); }
[data-theme="light"] .t-letter { background: #e3e5ea; color: #0d0e12; }
[data-theme="light"] .steps li.active, [data-theme="light"] .steps li.done { color: #0d0e12; }
[data-theme="light"] .steps li i { border-color: #d3d6dc; }
[data-theme="light"] .tx-link { color: #0d0e12; background: rgba(0,0,0,.05); }
[data-theme="light"] .toast { background: #0d0e12; color: #fff; }

/* статистика, баннер, таблицы */
[data-theme="light"] .stats-row > div, [data-theme="light"] .table-card, [data-theme="light"] .pf-total, [data-theme="light"] .pf-tabs,
[data-theme="light"] .pf-none, [data-theme="light"] .nft, [data-theme="light"] .act-list, [data-theme="light"] .idx-card, [data-theme="light"] .idx-chart-card,
[data-theme="light"] .idx-block, [data-theme="light"] .idx-trade, [data-theme="light"] .idx-pos, [data-theme="light"] .idx-stats > div, [data-theme="light"] .fav-toggle,
[data-theme="light"] body[data-view="portfolio"] .pf-total, [data-theme="light"] body[data-view="portfolio"] .table-card, [data-theme="light"] body[data-view="portfolio"] .pf-tabs,
[data-theme="light"] body[data-view="portfolio"] .nft, [data-theme="light"] body[data-view="portfolio"] .act-list, [data-theme="light"] body[data-view="portfolio"] .pf-none {
  background: #fff; border-color: rgba(0,0,0,.07); color: #0d0e12;
}
[data-theme="light"] .nft-strip { background: #fff !important; border-color: rgba(0,0,0,.07) !important; color: #0d0e12; }
[data-theme="light"] .nft-strip b, [data-theme="light"] .nft-strip em { color: #0d0e12; }
[data-theme="light"] .hero-banner { background: linear-gradient(160deg, #fff, #eef0f3); color: #0d0e12; }
[data-theme="light"] .tabs a { color: #a3a8b3; }
[data-theme="light"] .tabs a:hover { color: #5d6270; }
[data-theme="light"] .tabs a.on { color: #0d0e12; }
[data-theme="light"] .table th[data-sort]:hover, [data-theme="light"] .table th.sorted { color: #0d0e12; }
[data-theme="light"] .table tbody tr:hover, [data-theme="light"] .act:hover,
[data-theme="light"] body[data-view="portfolio"] .table tbody tr:hover, [data-theme="light"] body[data-view="portfolio"] .act:hover { background: #f3f4f7; }
[data-theme="light"] .row-btn, [data-theme="light"] body[data-view="portfolio"] .row-btn { background: #eef0f3; color: #0d0e12; }
[data-theme="light"] .row-btn:hover, [data-theme="light"] body[data-view="portfolio"] .row-btn:hover { background: #0d0e12; color: #fff; }
[data-theme="light"] .pf-tabs button:hover { color: #0d0e12; }
[data-theme="light"] .pf-tabs button.on, [data-theme="light"] body[data-view="portfolio"] .pf-tabs button.on { background: #0d0e12; color: #fff; }
[data-theme="light"] .act { color: #0d0e12; border-color: rgba(0,0,0,.05); }
[data-theme="light"] .act-ico { background: #eef0f3; }
[data-theme="light"] .act-ico:not(:has(img)) { background: #e3e5ea; }
[data-theme="light"] .act-ico i { border-color: #fff; }
[data-theme="light"] .nft img { background: #eef0f3; }
[data-theme="light"] .fav:hover { color: #3a3d45; background: rgba(0,0,0,.05); }
[data-theme="light"] .fav-toggle:hover { color: #0d0e12; }
[data-theme="light"] .idx-ranges button.on, [data-theme="light"] .idx-tabs button.on { background: rgba(0,0,0,.07); color: #0d0e12; }
[data-theme="light"] .idx-parts li span { color: #3a3d45; }
[data-theme="light"] .idx-trade .field, [data-theme="light"] .idx-trade .details { background: #f3f4f7; border-color: rgba(0,0,0,.05); }
[data-theme="light"] .unit { background: rgba(0,0,0,.06); }
[data-theme="light"] .pos-row b { color: #0d0e12; }
[data-theme="light"] .pos-row { border-color: rgba(0,0,0,.06); }
[data-theme="light"] .idx-card.on { border-color: rgba(0,0,0,.5); }
[data-theme="light"] .btn-main { background: #0d0e12; color: #fff; }
[data-theme="light"] .btn-ghost { background: rgba(0,0,0,.06); color: #0d0e12; }

/* нижняя панель */
@media (max-width: 860px) {
  [data-theme="light"] .tabbar { background: rgba(255,255,255,.85); border-color: rgba(0,0,0,.08); box-shadow: 0 18px 40px -18px rgba(20,22,30,.35); }
  [data-theme="light"] .tabbar a { color: #7b808c; }
  [data-theme="light"] .tabbar a.on { color: #0d0e12; }
}

/* шапка на страницах Market и API: логотип слева, кнопка темы справа */
header.top:has(.theme-slot) { display: flex; align-items: center; }

/* Market (страница «скоро») */
[data-theme="light"] body:has(.ring) { --bg: #f3f4f7; color: #0d0e12; }
[data-theme="light"] .blob.a { background: rgba(125,131,143,.35); }
[data-theme="light"] .blob.b { background: rgba(150,155,165,.4); }
[data-theme="light"] .blob.c { background: rgba(115,121,133,.2); }
[data-theme="light"] .ring .track { stroke: rgba(0,0,0,.08); }
[data-theme="light"] .ring .prog { stroke: #3a3d45; }
[data-theme="light"] .ring .glint { stroke: #0d0e12; filter: none; }
[data-theme="light"] .ring .spin { border-top-color: rgba(0,0,0,.3); border-right-color: rgba(0,0,0,.08); }
[data-theme="light"] .ring .spin.slow { border-top-color: rgba(0,0,0,.12); border-right-color: transparent; }
[data-theme="light"] .ring .nft { background: #fff; box-shadow: 0 20px 50px -24px rgba(20,22,30,.4), inset 0 0 0 1px rgba(0,0,0,.06); }

/* API (терминал с матрицей) */
[data-theme="light"] body:has(#rain) { background: #f3f4f7; color: #3a3d45; }
[data-theme="light"] .vignette { background: radial-gradient(ellipse at center, transparent 30%, #f3f4f7 85%); }
[data-theme="light"] .term { background: rgba(255,255,255,.94); border-color: rgba(0,0,0,.08); box-shadow: 0 30px 70px -30px rgba(20,22,30,.35); }
[data-theme="light"] .bar { border-color: rgba(0,0,0,.07); color: #7b808c; }
[data-theme="light"] .k { color: #3a3d45; } [data-theme="light"] .s, [data-theme="light"] .w { color: #0d0e12; } [data-theme="light"] .n, [data-theme="light"] .p { color: #6b7080; } [data-theme="light"] .c { color: #a3a8b3; }
[data-theme="light"] .cursor { background: #0d0e12; }
[data-theme="light"] .cta a { border-color: rgba(0,0,0,.14); color: #0d0e12; }
[data-theme="light"] .cta a:first-child { background: #0d0e12; color: #fff; }
@media (max-width: 860px) {
  [data-theme="light"] .tabbar {
    background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.55) 55%, rgba(255,255,255,.7)), rgba(255,255,255,.35);
    border-color: rgba(255,255,255,.9);
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(0,0,0,.04), 0 18px 40px -18px rgba(20,22,30,.35), 0 0 0 1px rgba(0,0,0,.05);
  }
}
@media (max-width: 860px) {
  [data-theme="light"] .tabbar { background: rgba(250,250,252,.72); border-color: rgba(0,0,0,.08); box-shadow: 0 10px 30px -12px rgba(20,22,30,.3); }
  [data-theme="light"] .tabbar a { color: rgba(13,14,18,.55); }
  [data-theme="light"] .tabbar a.on { background: rgba(0,0,0,.07); color: #0d0e12; }
}
@media (max-width: 860px) {
  [data-theme="light"] .tabbar a { color: #7a7f8a; }
  [data-theme="light"] .tabbar a.on { background: none; color: #0d0e12; }
}
[data-theme="light"] body[data-view="portfolio"]::before { background: #f3f4f7; }
[data-theme="light"] body[data-view="portfolio"], [data-theme="light"] body[data-view="portfolio"]::before { background: #f3f4f7; }
[data-theme="light"] { color-scheme: light; }

/* кнопка темы — как «таблетка» подключённого кошелька: тот же цвет, без обводки */
.theme-btn { width: 40px; height: 40px; border: 0 !important; border-radius: 999px; background: #2a2a30; color: #fff; box-shadow: none; }
.theme-btn:hover { background: #35353c; }
[data-theme="light"] .theme-btn { background: #ffffff; color: #0d0e12; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
[data-theme="light"] .theme-btn:hover { background: #eef0f3; }

/* Кнопка темы не участвует в «растворении» страницы при смене темы: раньше браузер показывал
   снимок старой иконки поверх анимации новой, и иконки дёргались. Теперь она анимируется сама. */
#themeBtn { view-transition-name: theme-btn; }
::view-transition-group(theme-btn) { animation: none; }
::view-transition-old(theme-btn) { display: none; }
::view-transition-new(theme-btn) { animation: none; }
.theme-btn svg { transition: opacity .3s ease, transform .45s cubic-bezier(.2,.8,.2,1); will-change: transform, opacity; }



/* смена темы: пока идёт растворение, панель плотная (без размытия), чтобы на снимке не становилась прозрачной */
.vt-run .tabbar { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: rgba(30,31,36,.94) !important; }
[data-theme="light"].vt-run .tabbar { background: rgba(250,250,252,.96) !important; }
[data-skin="v2"].vt-run .tabbar { background: #12284d !important; }
[data-skin="v2"][data-theme="light"].vt-run .tabbar { background: #f4f8ff !important; }

/* подсветка кнопки темы при наведении — только для мыши (на телефоне после нажатия она залипала, и кнопка серела) */
@media (hover: none) {
  .theme-btn:hover { background: #2a2a30 !important; }
  [data-theme="light"] .theme-btn:hover { background: #ffffff !important; }
  [data-skin="v2"] .theme-btn:hover { background: var(--v2-glass) !important; }
}
[data-theme="light"] .act-ico.pair { background: linear-gradient(145deg, #2a8cff, #0b5fd0); }
[data-theme="light"] .act-ico.pair i { background: #fff; color: #0b5fd0; border-color: #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.08); }
[data-theme="light"] .price-chip { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.06); }

/* иконка темы — чётный размер (20px в кнопке 40px): при нечётном она вставала на полпикселя и выглядела сдвинутой */
.theme-btn { padding: 0; }
.theme-btn svg { width: 20px !important; height: 20px !important; }
[data-theme="light"] .nav-pill { background: rgba(0,0,0,.06); }
[data-theme="light"] .nav a.on { background: none; }

/* ===== без обводок у плашек ===== */
.swap, .stats-row > div, .table-card, .nft-strip, .pf-total, .pf-tabs, .pf-none, .nft, .act-list, .idx-card, .idx-chart-card, .idx-block, .idx-trade, .idx-pos, .modal-card, .brand-menu, .tabbar, .fav-toggle, .page-search,
.card, .stats div, .event, .tabs, .suggest, .more, .ev-group, .kpi, .gift, .eco-cat, .seg, .search, .theme-btn, .dw-pill, .dw-menu,
[data-theme="light"] .swap, [data-theme="light"] .stats-row > div, [data-theme="light"] .table-card, [data-theme="light"] .nft-strip, [data-theme="light"] .pf-total,
[data-theme="light"] .pf-tabs, [data-theme="light"] .pf-none, [data-theme="light"] .nft, [data-theme="light"] .act-list, [data-theme="light"] .modal-card,
[data-theme="light"] .brand-menu, [data-theme="light"] .tabbar, [data-theme="light"] .card, [data-theme="light"] .event, [data-theme="light"] .tabs,
[data-theme="light"] .kpi, [data-theme="light"] .gift, [data-theme="light"] .eco-cat, [data-theme="light"] .search, [data-theme="light"] .theme-btn { border: 0 !important; }
.nft-strip { border: 0 !important; }
[data-theme="light"] .seg-pill { background: #0d0e12; }
[data-theme="light"] .idx-tabs .seg-pill, [data-theme="light"] .idx-ranges .seg-pill { background: rgba(0,0,0,.07); }
[data-theme="light"] #pfTabs button.on { color: #fff !important; }