:root{
  --bg:oklch(0.15 0.006 260);
  --surface:oklch(0.185 0.007 260);
  --surface-2:oklch(0.225 0.008 260);
  --line:oklch(0.29 0.008 260);
  --hair:oklch(0.24 0.007 260);
  --text:oklch(0.97 0.004 260);
  --hint:oklch(0.70 0.012 260);
  --hint-2:oklch(0.55 0.012 260);
  --accent:oklch(0.80 0.13 82);
  --accent-hi:oklch(0.84 0.12 84);
  --accent-soft:oklch(0.80 0.13 82 / .13);
  --accent-line:oklch(0.80 0.13 82 / .4);
  --accent-ink:oklch(0.22 0.02 82);
  --up:oklch(0.74 0.15 150);
  --up-soft:oklch(0.74 0.15 150 / .14);
  --down:oklch(0.64 0.17 25);
  --r:14px;
  /* elevation: тень = "элемент физически выше", не декор; холодный near-black в тон палитре */
  --shadow-btn:0 1px 2px oklch(0.05 0.01 260 / .45),0 4px 12px -2px oklch(0.05 0.01 260 / .5);
  --shadow-1:0 1px 2px oklch(0.05 0.01 260 / .5),0 10px 28px -8px oklch(0.05 0.01 260 / .55);
  --shadow-2:0 -10px 40px oklch(0.05 0.01 260 / .6);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0;}
html,body{height:100%;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Roboto,sans-serif;
  background:var(--bg);color:var(--text);font-size:15px;line-height:1.45;
}
.tnum{font-variant-numeric:tabular-nums;}
svg{display:block;}
.hidden{display:none !important;}
/* keyboard-focus: бренд-кольцо вместо браузерного синего; .field:focus перекрывает своим бордером */
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

.app{display:flex;flex-direction:column;height:100dvh;max-width:520px;margin:0 auto;
  background:radial-gradient(760px 480px at 50% -10%, oklch(0.19 0.012 260), var(--bg) 62%);}

/* slim, sober header — доверие через сдержанность, не через блеск */
.top{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;
  padding:calc(13px + env(safe-area-inset-top)) 16px 11px;}
.brand{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;letter-spacing:-.2px;}
.brand .mark{width:22px;height:22px;border-radius:7px;background:var(--accent);color:var(--accent-ink);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.brand .mark svg{width:13px;height:13px;}
.secure{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--hint-2);}
.secure svg{width:13px;height:13px;color:var(--hint);}

/* trust-строка на Главной: кастоди + 2FA, без пафоса */
.trust{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--hint);
  margin-top:14px;padding:11px 13px;background:var(--surface);border:1px solid var(--line);border-radius:12px;}
.trust svg{width:16px;height:16px;color:var(--hint);flex:0 0 auto;}
.trust a{color:var(--accent);margin-left:auto;font-weight:600;white-space:nowrap;cursor:pointer;}

/* мелкий риск/юр-текст: главный маркер легитимности финприложения */
.microcopy{font-size:11px;color:var(--hint-2);margin-top:9px;padding:0 2px;line-height:1.5;}

.screen{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.screen::-webkit-scrollbar{display:none;}
.view{display:none;padding:18px 16px 26px;}
.view.on{display:block;animation:in .22s cubic-bezier(.2,.8,.2,1);}
@keyframes in{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

.eyebrow{font-size:12px;color:var(--hint-2);text-transform:uppercase;letter-spacing:.7px;font-weight:600;margin:0 2px 9px;}
.eyebrow.sp{margin-top:24px;}
.h1{font-size:23px;font-weight:700;letter-spacing:-.5px;}

.prow{display:flex;align-items:center;gap:11px;margin-bottom:20px;}
.prow .ava{width:42px;height:42px;border-radius:13px;
  background:linear-gradient(140deg,var(--accent),oklch(0.6 0.13 52));
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;color:var(--accent-ink);}
.prow .nm{line-height:1.2;flex:1;min-width:0;}
.prow .nm b{font-size:16px;}
.prow .nm span{font-size:12.5px;color:var(--hint);}
.chip{font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:999px;
  background:var(--surface-2);color:var(--hint);border:1px solid var(--line);white-space:nowrap;}

.bal{margin:0 2px 4px;}
.bal .lab{font-size:12.5px;color:var(--hint);}
.bal .big{font-size:clamp(34px,11vw,42px);font-weight:700;letter-spacing:-1.3px;line-height:1.08;margin-top:3px;}
.bal .sub{font-size:13px;color:var(--hint);margin-top:3px;}
.bal-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;}
.spark{width:100px;height:46px;flex:0 0 auto;}
.balactions{display:flex;gap:10px;margin:18px 0 4px;}

.btn{border:none;border-radius:13px;padding:13px 15px;font-size:14.5px;font-weight:700;
  font-family:inherit;cursor:pointer;color:var(--text);
  transition:transform .14s cubic-bezier(.2,.8,.2,1),filter .15s,background .15s,box-shadow .15s;min-height:48px;}
.btn:active{transform:scale(.975);}
.btn.pri{background:var(--accent);color:var(--accent-ink);box-shadow:var(--shadow-btn);}
.btn.pri:hover{background:var(--accent-hi);}
.btn.pri:active{box-shadow:0 1px 2px oklch(0.05 0.01 260 / .45);}
.btn.ghost{background:var(--surface-2);color:var(--text);border:1px solid var(--line);}
.btn.danger{background:transparent;color:var(--down);border:1px solid var(--down);}
.btn.full{width:100%;}
.btn.lg{padding:16px;font-size:15.5px;min-height:54px;}
.btn[disabled]{opacity:.5;pointer-events:none;}
.grow{flex:1;}

/* deposit panel */
.deposit{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:15px;margin-top:14px;
  box-shadow:var(--shadow-1);}
.nets{display:flex;gap:8px;margin-bottom:13px;}
.net{flex:1;background:var(--surface-2);border:1px solid transparent;border-radius:11px;padding:10px 6px;
  text-align:center;cursor:pointer;transition:.15s;}
.net b{font-size:13px;font-weight:700;}
.net small{display:block;color:var(--hint-2);font-size:10px;margin-top:2px;}
.net.on{border-color:var(--accent);background:var(--accent-soft);}
.addr{display:flex;align-items:center;gap:8px;background:var(--surface-2);border:1px solid var(--line);
  border-radius:10px;padding:11px 12px;font-size:12px;font-family:ui-monospace,Menlo,monospace;
  color:var(--text);word-break:break-all;}
.addr .cp{margin-left:auto;color:var(--accent);font-weight:700;cursor:pointer;flex:0 0 auto;font-family:inherit;}
.warn{font-size:11.5px;color:oklch(0.78 0.09 82);background:oklch(0.30 0.05 82 / .25);
  border:1px solid var(--accent-line);border-radius:10px;padding:10px 12px;margin-top:11px;line-height:1.5;}

/* поля ввода (вывод, адреса) — в тон .addr */
.field{width:100%;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;
  padding:11px 12px;font-size:13px;color:var(--text);font-family:inherit;margin-top:10px;}
.field::placeholder{color:var(--hint-2);}
.field:focus{outline:none;border-color:var(--accent-line);}
.field.mono{font-family:ui-monospace,Menlo,monospace;}
select.field{appearance:none;-webkit-appearance:none;}
.frow{display:flex;gap:8px;align-items:stretch;}
.frow .field{flex:1;min-width:0;width:auto;}
.frow .btn{margin-top:10px;flex:0 0 auto;min-height:0;padding:11px 14px;font-size:13px;}
.brk{word-break:break-all;}
.opt.dis{opacity:.45;cursor:default;}

.list{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;}
.item{display:flex;align-items:center;gap:12px;padding:14px;border-top:1px solid var(--hair);}
.item:first-child{border-top:none;}
.coin{width:36px;height:36px;border-radius:10px;flex:0 0 auto;display:flex;align-items:center;
  justify-content:center;font-weight:800;font-size:13px;color:oklch(0.15 0.02 260);}
.c-usdt{background:oklch(0.72 0.1 168);}
.c-ton{background:oklch(0.72 0.11 235);}
.c-btc{background:oklch(0.76 0.13 62);}
.c-eth{background:oklch(0.7 0.1 285);}
.c-def{background:var(--hint);}
.item .mid{flex:1;min-width:0;}
.item .mid b{font-size:14.5px;font-weight:600;display:block;}
.item .mid span{font-size:12px;color:var(--hint);}
.item .rt{text-align:right;}
.item .rt b{font-size:14.5px;font-weight:600;}
.item .rt span{font-size:12px;color:var(--hint);display:block;}
.item .rt b.plus{color:var(--up);}
.item .rt b.minus{color:var(--text);}
.item .rt b.neg{color:var(--down);}

.empty{background:var(--surface);border:1px dashed var(--line);border-radius:var(--r);
  padding:22px 16px;text-align:center;color:var(--hint);font-size:13px;line-height:1.5;}

.earn{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;
  display:flex;align-items:center;gap:16px;}
.earn .fig{flex:1;}
.earn .fig .v{font-size:26px;font-weight:700;color:var(--up);letter-spacing:-.5px;}
.earn .fig .d{font-size:13px;color:var(--hint);margin-top:1px;}
.earn .pct{font-size:13px;font-weight:700;color:var(--up);background:var(--up-soft);
  padding:5px 9px;border-radius:8px;align-self:flex-start;}

.stats{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  display:grid;grid-template-columns:1fr 1fr;}
.stat{padding:16px;border-top:1px solid var(--hair);border-left:1px solid var(--hair);}
.stat:nth-child(-n+2){border-top:none;}
.stat:nth-child(odd){border-left:none;}
.stat .v{font-size:21px;font-weight:700;letter-spacing:-.4px;}
.stat .v.pos{color:var(--up);}
.stat .l{font-size:12px;color:var(--hint);margin-top:2px;}

/* work */
.statusbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;}
.run-pill{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;
  padding:7px 12px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);color:var(--hint);}
.run-pill .led{width:7px;height:7px;border-radius:50%;background:var(--hint-2);}
.run-pill.live{color:var(--accent);border-color:var(--accent-line);background:var(--accent-soft);}
.run-pill.live .led{background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);animation:pulse 1.8s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.4;}}

/* сетка связок: каталог данных (разный тикер/спред/график на карточке), не декоративная плитка.
   Главный интерактив экрана — карточки приподняты (--shadow-1), как deposit/plan-detail. */
#v-ops .eyebrow{margin-top:14px;}
.pairgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px;}
.paircard{position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:13px 13px 0;box-shadow:var(--shadow-1);cursor:pointer;
  transition:transform .14s cubic-bezier(.2,.8,.2,1);}
.paircard:active{transform:scale(.975);}
.paircard .sym{font-size:17px;font-weight:700;letter-spacing:-.3px;padding-right:20px;}
.paircard .rng{font-size:12.5px;color:var(--hint);margin-top:3px;}
.paircard .min{font-size:12px;color:var(--hint-2);margin-top:1px;}
.paircard .pl{font-size:11px;color:var(--hint-2);margin-top:8px;}
.paircard .cq{position:absolute;top:11px;right:12px;color:var(--hint-2);font-size:19px;line-height:1;}
.paircard .spark{width:calc(100% + 26px);height:36px;margin:4px -13px 0;}

.ops{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:15px;margin:14px 0 20px;}
.ops .top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:10px;}
.ops .top .lim{color:var(--hint);}
.track{height:8px;border-radius:99px;background:var(--surface-2);overflow:hidden;}
.track i{display:block;height:100%;border-radius:99px;background:var(--accent);transition:width .3s;}
.ops .hintline{font-size:11.5px;color:var(--hint-2);margin-top:10px;}

.pick{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:16px;}
.opt{display:flex;align-items:center;gap:12px;padding:15px 14px;border-top:1px solid var(--hair);cursor:pointer;transition:background .15s;}
.opt:first-child{border-top:none;}
.opt.sel{background:var(--accent-soft);}
.opt .mid{flex:1;min-width:0;}
.opt .mid b{font-size:14.5px;font-weight:600;}
.opt .mid span{font-size:12px;color:var(--hint);display:block;}
.opt .sp{text-align:right;}
.opt .sp b{font-size:15px;font-weight:700;color:var(--up);}
.opt .sp span{font-size:11.5px;color:var(--hint);display:block;}
.radio{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);flex:0 0 auto;position:relative;}
.opt.sel .radio{border-color:var(--accent);}
.opt.sel .radio:after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--accent);}

.amount{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:15px;
  display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.amount .l{font-size:13px;color:var(--hint);}
.amount .v{font-size:20px;font-weight:700;}
.amount .edit{font-size:13px;color:var(--accent);font-weight:600;cursor:pointer;padding:6px;background:none;border:none;font-family:inherit;}

/* subscriptions — сегмент-селектор + один фокус-блок (без повторяющихся карточек) */
.sub-intro{font-size:13px;color:var(--hint);margin-bottom:18px;line-height:1.5;}
.seg{display:flex;gap:5px;background:var(--surface-2);border:1px solid var(--line);
  border-radius:15px;padding:5px;margin-bottom:16px;}
.seg button{flex:1;background:none;border:none;border-radius:11px;padding:10px 4px;cursor:pointer;
  font-family:inherit;display:flex;flex-direction:column;align-items:center;gap:2px;position:relative;transition:.15s;}
.seg button b{font-size:14px;font-weight:700;color:var(--text);}
.seg button small{font-size:11px;color:var(--hint);}
.seg button.on{background:var(--accent);}
.seg button.on b,.seg button.on small{color:var(--accent-ink);}
.seg button .now{position:absolute;top:6px;right:8px;width:6px;height:6px;border-radius:50%;background:var(--up);}
.seg button.on .now{background:var(--accent-ink);}

.plan-detail{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;
  box-shadow:var(--shadow-1);}
.pd-hero{display:flex;align-items:center;gap:14px;}
.pd-num{font-size:52px;font-weight:800;letter-spacing:-2px;line-height:.9;color:var(--accent);}
.pd-unit{font-size:14px;color:var(--hint);line-height:1.2;}
.pd-price{font-size:15px;font-weight:600;color:var(--text);margin-top:12px;}
.pd-price span{color:var(--hint);font-weight:500;}
.pd-feats{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:9px;}
.pd-feats li{font-size:13.5px;color:var(--hint);padding-left:18px;position:relative;}
.pd-feats li:before{content:"";position:absolute;left:2px;top:7px;width:6px;height:6px;border-radius:50%;background:var(--accent);}
.plan-detail .btn{margin-top:20px;}
.curtag{margin-top:20px;text-align:center;font-size:12.5px;color:var(--hint);
  padding:12px;border-radius:12px;background:var(--surface-2);}
.paynote{font-size:12px;color:var(--hint-2);text-align:center;margin-top:14px;padding:0 8px;line-height:1.5;}
.paynote b{color:var(--hint);}

/* more */
.group{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:16px;}
/* «Ещё»: два смысловых кластера — (аккаунт + безопасность) и (предпочтения + сервис).
   Внутри кластера тесно, между кластерами воздух; иерархия тихая, не кричащая. */
#v-more .group{margin-bottom:14px;}
#v-more .group.split{margin-bottom:28px;}
.group.main .si{background:var(--accent-soft);}   /* идентичность: тёплый контейнер иконки */
.group.ref .si{color:var(--hint);}                /* справочное: иконка не зазывает */
.srow{display:flex;align-items:center;gap:13px;padding:15px 14px;border-top:1px solid var(--hair);cursor:pointer;min-height:56px;}
.srow:first-child{border-top:none;}
.srow .si{width:34px;height:34px;border-radius:9px;background:var(--surface-2);display:flex;
  align-items:center;justify-content:center;color:var(--accent);flex:0 0 auto;}
.srow .lab{flex:1;font-size:14.5px;}
.srow .val{font-size:13px;color:var(--hint);}
.srow .cq{color:var(--hint-2);font-size:19px;line-height:1;}
.toggle{width:46px;height:27px;border-radius:99px;background:var(--surface-2);border:1px solid var(--line);
  position:relative;cursor:pointer;transition:background .18s;flex:0 0 auto;}
.toggle.on{background:var(--accent);border-color:var(--accent);}
.toggle:after{content:"";position:absolute;top:2px;left:2px;width:21px;height:21px;border-radius:50%;
  background:var(--text);transition:transform .18s cubic-bezier(.2,.8,.2,1);}
.toggle.on:after{transform:translateX(19px);background:var(--accent-ink);}
.about{text-align:center;font-size:11.5px;color:var(--hint-2);margin-top:4px;line-height:1.7;}

/* bottom sheet — единый примитив для второстепенных экранов (профиль, адреса, язык, ...) */
.sheet-backdrop{position:fixed;inset:0;z-index:50;background:oklch(0.1 0.006 260 / .62);
  display:flex;align-items:flex-end;justify-content:center;animation:fade .18s ease-out;}
@keyframes fade{from{opacity:0;}to{opacity:1;}}
.sheet{width:100%;max-width:520px;max-height:82dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;
  background:var(--surface);border:1px solid var(--line);border-bottom:none;border-radius:18px 18px 0 0;
  padding:16px 16px calc(22px + env(safe-area-inset-bottom));
  box-shadow:var(--shadow-2);
  animation:up .22s cubic-bezier(.2,.8,.2,1);}
@keyframes up{from{transform:translateY(28px);opacity:.5;}to{transform:none;opacity:1;}}
.sheet-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.sheet-head b{font-size:17px;font-weight:700;letter-spacing:-.3px;}
.sheet-x{width:30px;height:30px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);
  color:var(--hint);font-size:12px;font-family:inherit;cursor:pointer;flex:0 0 auto;}
.sheet-body .group{background:var(--surface-2);}
.sheet-body .srow{cursor:default;}
.sheet-body p{font-size:13.5px;color:var(--hint);line-height:1.55;margin:0 0 12px;}
.sheet-body p b{color:var(--text);font-weight:600;}
.sheet-body .pick,.sheet-body .list{background:var(--surface-2);}
.sheet-body a{color:var(--accent);font-weight:600;text-decoration:none;}
.del{margin-left:4px;background:none;border:none;color:var(--hint-2);font-size:15px;
  font-family:inherit;cursor:pointer;padding:6px;flex:0 0 auto;}
.del:active{color:var(--down);}

/* bottom nav */
.nav{flex:0 0 auto;display:flex;background:var(--surface);border-top:1px solid oklch(0.11 0.006 260);
  padding:9px 0 calc(8px + env(safe-area-inset-bottom));}
.nav button{flex:1;background:none;border:none;color:var(--hint-2);font-family:inherit;font-size:10.5px;font-weight:600;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;
  transition:color .15s;min-height:46px;}
.nav button.on{color:var(--accent);}
.nav button svg{width:24px;height:24px;}