:root{
  --bg:#0B0F1A; --surface:#12182A; --surface2:#161E30; --border:#1E2A42;
  --accent:#7B5CFF; --accent2:#00D4FF; --accent-dark:#3B1FCC;
  --text:#E8F0FF; --muted:#6B82A8; --green:#00FFB0; --gold:#E8C840; --red:#FF6B6B;
  --r-card:20px; --r-row:14px;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{background:var(--bg)}
body{background:var(--bg);color:var(--text);font-family:'Exo 2',system-ui,sans-serif;
  font-size:15px;line-height:1.5;min-height:100vh;overflow-x:hidden}
.orb{position:fixed;top:-200px;right:-130px;width:400px;height:400px;border-radius:50%;
  background:rgba(123,92,255,.20);filter:blur(120px);pointer-events:none;z-index:0}

.step{display:none;position:relative;z-index:1;max-width:520px;margin:0 auto;
  padding:calc(20px + var(--pad-top, 0px)) 20px
          calc(28px + env(safe-area-inset-bottom,0px));
  min-height:100vh;
  flex-direction:column}
.step.on{display:flex;animation:fade .22s ease}
.step{min-height:var(--tg-viewport-stable-height, 100vh)}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.bar{display:flex;align-items:center;gap:12px;margin-bottom:22px;min-height:34px}
.back{width:34px;height:34px;flex:none;border-radius:50%;border:1px solid var(--border);
  background:var(--surface);display:grid;place-items:center;cursor:pointer}
.back svg{width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round}
.dots{display:flex;gap:5px;margin-left:auto}
.dot{width:22px;height:3px;border-radius:2px;background:var(--border);transition:background .25s}
.dot.on{background:var(--accent)}

h1{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:27px;color:#fff;
  line-height:1.15;margin-bottom:9px}
.lede{font-size:14px;color:var(--muted);line-height:1.65;margin-bottom:20px}
.grow{flex:1;min-height:12px}

/* ---- logo + intro ---- */
.logo{position:relative;width:100%;max-width:290px;aspect-ratio:1200/431;margin:0 auto 16px}
.ltr,.rift{position:absolute;display:block}
.logowrap{position:relative;width:148px;height:148px;margin:0 auto 24px}
.logowrap::before{content:'';position:absolute;inset:-32%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(123,92,255,.42) 0%,rgba(123,92,255,.16) 42%,rgba(123,92,255,0) 70%)}
.logo{position:relative;width:100%;height:100%;display:block}
#spark{opacity:0}
.wordmark{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:38px;color:#fff;
  text-align:center;letter-spacing:.09em;line-height:1;margin-bottom:12px}
.tagline{font-size:10.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--muted);
  text-align:center;margin-bottom:26px}

/* played once on first launch, skipped afterwards */
.intro #spark{animation:spark .45s ease-out .15s both}
.intro .ltr{animation:pop .8s cubic-bezier(.2,.9,.3,1) both}
.intro .ltr:nth-child(1){animation-delay:.55s}
.intro .ltr:nth-child(2){animation-delay:.08s}
.intro .ltr:nth-child(3){animation-delay:.86s}
.intro .ltr:nth-child(4){animation-delay:1.16s}
.intro .ltr:nth-child(6){animation-delay:.36s}
.intro .ltr:nth-child(7){animation-delay:1.01s}
.intro .ltr:nth-child(8){animation-delay:.22s}
.intro .ltr:nth-child(9){animation-delay:.71s}
.intro .rift{animation:rift 1.15s ease-out 1.65s both}
@keyframes pop{
  from{opacity:0;transform:translateY(9px) scale(.86)}
  to{opacity:1;transform:none}
}
@keyframes rift{
  0%{opacity:0;clip-path:inset(50% 0 50% 0);filter:brightness(2.4)}
  55%{opacity:1;clip-path:inset(0 0 0 0);filter:brightness(2.4)}
  100%{opacity:1;clip-path:inset(0 0 0 0);filter:brightness(1)}
}
.intro #star{animation:star .55s cubic-bezier(.2,.9,.25,1) .5s both}
.intro #ring{animation:ring .65s ease-out .9s both}
.intro .wordmark{animation:rise .45s ease-out 1.3s both}
.intro .tagline{animation:rise .6s ease-out 2.55s both}
.intro .lede{animation:rise .6s ease-out 2.72s both}
.intro .btns{animation:rise .65s ease-out 2.9s both}

@keyframes spark{
  0%{opacity:0;transform:scale(.2)}
  55%{opacity:1;transform:scale(1.5)}
  100%{opacity:0;transform:scale(.4)}
}
@keyframes star{
  from{opacity:0;transform:scale(.05) rotate(-70deg)}
  to{opacity:1;transform:scale(1) rotate(0)}
}
@keyframes ring{
  from{stroke-dashoffset:560;opacity:0}
  to{stroke-dashoffset:0;opacity:1}
}
@keyframes rise{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:none}
}
#spark,#star{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:reduce){
  .intro #spark,.intro #star,.intro #ring,.intro .wordmark,
  .intro .tagline,.intro .lede,.intro .btns{animation:none}
}

.btn{display:block;width:100%;font-family:inherit;font-size:14px;font-weight:700;
  padding:15px 20px;border-radius:999px;border:1px solid var(--accent);
  background:rgba(123,92,255,.12);color:var(--accent);cursor:pointer;
  transition:transform .12s,opacity .2s;margin-top:10px;text-align:center}
.btn:active{transform:scale(.97)}
.btn.solid{background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  border-color:transparent;color:#fff}
.btn:disabled{opacity:.35;cursor:not-allowed}
.btn.quiet{border-color:var(--border);background:transparent;color:var(--muted)}

label{display:block;font-size:11px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--muted);margin-bottom:8px}
/* Every text field, not only the password one. The amount and memo on Send
   were falling through to the browser's own styling - white boxes in the
   middle of a dark screen. */
input[type=text],input[type=email],input[type=number],input[type=search],
input[type=password],textarea{width:100%;background:rgba(123,92,255,.04);
  border:1px solid var(--border);border-radius:12px;color:var(--text);
  font-family:inherit;font-size:15px;padding:14px 15px;outline:none;
  transition:border-color .2s,box-shadow .2s;-webkit-appearance:none}
input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(123,92,255,.10)}
textarea{resize:none;min-height:110px;line-height:1.8}
.field{margin-bottom:16px}

/* segmented control */
.seg{display:flex;gap:6px;background:var(--surface);border:1px solid var(--border);
  border-radius:999px;padding:4px;margin-bottom:18px}
.seg button{flex:1;background:transparent;border:none;border-radius:999px;padding:10px 8px;
  font-family:inherit;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer;
  transition:all .18s}
.seg button.on{background:linear-gradient(135deg,var(--accent-dark),var(--accent));color:#fff}

.meter{height:4px;border-radius:2px;background:var(--border);overflow:hidden;margin-top:10px}
.meter i{display:block;height:100%;width:0;background:var(--red);transition:width .3s,background .3s}
.meter-txt{font-size:12px;color:var(--muted);margin-top:7px;min-height:18px}

.warn{display:flex;gap:11px;align-items:flex-start;background:rgba(232,200,64,.05);
  border:1px solid rgba(232,200,64,.28);border-radius:var(--r-row);padding:14px;margin-bottom:16px}
.warn svg{width:17px;height:17px;stroke:var(--gold);fill:none;stroke-width:1.8;flex:none;margin-top:2px}
.warn p{font-size:12.5px;color:var(--muted);line-height:1.65}
.warn b{color:var(--gold);font-weight:600}
.warn.red{background:rgba(255,107,107,.05);border-color:rgba(255,107,107,.28)}
.warn.red svg{stroke:var(--red)} .warn.red b{color:var(--red)}

/* seed grid */
.seedwrap{position:relative;margin-bottom:12px}
.seed{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);padding:14px}
.seed.long{grid-template-columns:repeat(3,1fr);gap:6px}
.word{display:flex;align-items:baseline;gap:5px;background:var(--surface2);
  border:1px solid var(--border);border-radius:9px;padding:8px 7px}
.word i{font-style:normal;font-size:9.5px;color:var(--muted);min-width:14px}
.word b{font-weight:600;font-size:13px}
.seed.long .word b{font-size:12px}
.veil{position:absolute;inset:0;border-radius:var(--r-card);
  background:rgba(11,15,26,.72);backdrop-filter:blur(9px);
  display:grid;place-items:center;cursor:pointer;text-align:center;padding:20px}
.veil.gone{display:none}
.veil svg{width:26px;height:26px;stroke:var(--accent);fill:none;stroke-width:1.7;margin-bottom:9px}
.veil p{font-size:13px;color:var(--text);font-weight:600}
.veil span{font-size:12px;color:var(--muted);display:block;margin-top:4px}

.copyrow{display:flex;gap:8px;margin-bottom:14px}
.copybtn{flex:1;background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:12px;font-family:inherit;font-size:13px;font-weight:600;color:var(--text);
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .15s}
.copybtn:active{transform:scale(.97)}
.copybtn.done{border-color:var(--green);color:var(--green)}
.copybtn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8}

.check{display:flex;gap:11px;align-items:flex-start;cursor:pointer;padding:4px 2px;margin-bottom:6px}
.box{width:21px;height:21px;flex:none;border-radius:6px;border:1.5px solid var(--border);
  display:grid;place-items:center;margin-top:1px;transition:all .18s}
.box svg{width:12px;height:12px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;opacity:0}
.check.on .box{background:var(--accent);border-color:var(--accent)}
.check.on .box svg{opacity:1}
.check p{font-size:13px;color:var(--muted);line-height:1.6}

/* ---- verification: slots + tray ---- */
.slots{display:flex;gap:10px;margin-bottom:22px}
.slot{flex:1;background:var(--surface);border:1.5px dashed var(--border);border-radius:var(--r-row);
  padding:14px 10px;text-align:center;min-height:78px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:6px;transition:all .18s}
.slot.hot{border-color:var(--accent);background:rgba(123,92,255,.08);transform:scale(1.03)}
.slot.filled{border-style:solid;border-color:var(--accent);background:rgba(123,92,255,.08);cursor:pointer}
.slot.ok{border-color:var(--green);background:rgba(0,255,176,.08)}
.slot.bad{border-color:var(--red);background:rgba(255,107,107,.08)}
.slot-n{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.slot-w{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:17px;color:#fff;min-height:22px}
.slot.ok .slot-w{color:var(--green)} .slot.bad .slot-w{color:var(--red)}

.tray{display:flex;flex-wrap:wrap;gap:7px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-card);padding:14px;min-height:60px}
.chip{background:var(--surface2);border:1px solid var(--border);border-radius:999px;
  padding:9px 15px;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--text);
  cursor:grab;touch-action:none;user-select:none;transition:transform .12s,opacity .18s,border-color .18s}
.chip.sel{border-color:var(--accent);background:rgba(123,92,255,.14);color:var(--accent)}
.chip.used{opacity:0;pointer-events:none;width:0;padding:0;margin:0;border:0;overflow:hidden}
.dragghost{position:fixed;z-index:999;pointer-events:none;background:rgba(123,92,255,.9);
  border:1px solid var(--accent);border-radius:999px;padding:9px 15px;font-size:13.5px;
  font-weight:600;color:#fff;box-shadow:0 8px 26px rgba(0,0,0,.5);transform:translate(-50%,-50%)}
.hint{font-size:12px;color:var(--muted);text-align:center;margin-top:12px;line-height:1.6}

.addr{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);
  padding:18px;margin-bottom:14px;position:relative;overflow:hidden}
.addr::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:.5}
.addr code{display:block;font-family:ui-monospace,monospace;font-size:12.5px;color:var(--green);
  word-break:break-all;line-height:1.6}
.blob{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-row);
  padding:14px;font-family:ui-monospace,monospace;font-size:10.5px;color:var(--muted);
  word-break:break-all;line-height:1.55;max-height:110px;overflow:auto;margin-bottom:14px}

.spin{width:20px;height:20px;border:2px solid rgba(123,92,255,.25);border-top-color:var(--accent);
  border-radius:50%;animation:sp .7s linear infinite;display:inline-block;vertical-align:-4px;margin-right:8px}
@keyframes sp{to{transform:rotate(360deg)}}
.err{font-size:13px;color:var(--red);margin-top:12px;line-height:1.6}
.pinrow{display:flex;gap:10px;justify-content:center;margin:6px 0 14px}
.pindot{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--border);transition:all .18s}
.pindot.on{background:var(--accent);border-color:var(--accent);box-shadow:0 0 12px rgba(123,92,255,.6)}
.pindot.bad{background:var(--red);border-color:var(--red);box-shadow:none}
.pinin{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.pinbox{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);
  padding:22px 18px;margin-bottom:16px;cursor:text;text-align:center}
.pinbox label{margin-bottom:14px}
.tiny{font-size:11.5px;color:var(--muted);text-align:center;line-height:1.6;margin-top:10px}
.wtop{display:flex;align-items:center;gap:11px;margin-bottom:16px}
.wava{width:40px;height:40px;border-radius:50%;flex:none;
  background:linear-gradient(135deg,var(--accent-dark),var(--accent2))}
.wwho{flex:1;min-width:0}
.wname{font-weight:600;font-size:15px;line-height:1.2}
.waddr{font-size:12px;color:var(--muted);margin-top:1px;font-family:ui-monospace,monospace}
.bal{position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-card);padding:24px 20px;margin-bottom:18px;text-align:center}
.bal::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.55}
.bal-label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.bal-value{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:40px;line-height:1;color:#fff;
  text-shadow:0 0 30px rgba(123,92,255,.32)}
.acts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:24px}
.act{display:flex;flex-direction:column;align-items:center;gap:7px;background:none;border:none;
  color:var(--text);font-family:inherit;font-size:11.5px;cursor:pointer;transition:transform .12s}
.act:active{transform:scale(.92)}
.act i{display:grid;place-items:center;width:52px;height:52px;border-radius:18px;
  background:rgba(123,92,255,.10);border:1px solid rgba(123,92,255,.28)}
.act svg{width:20px;height:20px;stroke:var(--accent);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.head{display:flex;align-items:baseline;justify-content:space-between;margin:0 4px 10px}
.head h2{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:17px;color:#fff}
.head span{font-size:12px;color:var(--muted)}
.sline{display:flex;justify-content:space-between;gap:12px;padding:9px 0;
  border-bottom:1px solid var(--border);font-size:13px;color:var(--muted)}
.sline b{color:var(--text);font-weight:600;text-align:right}
.sline.strong{color:var(--text)}
.sbad{margin-top:12px;padding:10px 12px;border-radius:12px;font-size:13px;
  color:var(--gold);background:rgba(232,200,64,.10);border:1px solid rgba(232,200,64,.28)}
/* a price carried through a pool too thin to sell into */
.row-fiat.soft{color:var(--muted);font-weight:600}
.head-r{display:flex;align-items:center;gap:10px}
.dust{background:transparent;border:1px solid var(--border);border-radius:999px;
  padding:4px 10px;font-family:inherit;font-size:11px;font-weight:600;
  color:var(--muted);cursor:pointer;transition:color .15s,border-color .15s,background .15s}
.dust.on{color:var(--accent);border-color:var(--accent);background:rgba(123,92,255,.14)}
.rows{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:22px}
.row{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-row);padding:12px 15px}
.sym{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;flex:none;
  font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:14px;color:#0B0F1A;overflow:hidden}
.sym img{width:100%;height:100%;object-fit:contain;display:block}
.sym.has-img{background:var(--surface2);border:1px solid var(--border)}
.row-main{flex:1;min-width:0}
.row-name{font-weight:600;font-size:15px}
.row-amt{font-size:12.5px;color:var(--muted);margin-top:1px}
.row-val{text-align:right;flex:none}
.row-fiat{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:16px;color:#fff}
.row-sub{font-size:11px;margin-top:2px;color:var(--muted)}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;
  background:rgba(11,15,26,.94);backdrop-filter:blur(16px);border-top:1px solid var(--border);
  padding-bottom:env(safe-area-inset-bottom,0px)}
.tabs.on{display:flex}
.tab{flex:1;background:none;border:none;padding:9px 0 8px;display:flex;flex-direction:column;
  align-items:center;gap:4px;color:var(--muted);font-family:inherit;font-size:10.5px;cursor:pointer}
.tab svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tab.sel{color:var(--accent)}
.wpad{padding-bottom:74px}
.set{display:flex;align-items:center;gap:13px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-row);padding:15px;margin-bottom:8px;font-size:14px;cursor:pointer}
.set svg{width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:1.7;flex:none}
.set span{flex:1}
.set.danger span{color:var(--red)} .set.danger svg{stroke:var(--red)}
.empty{text-align:center;padding:34px 16px;color:var(--muted);font-size:13px;line-height:1.7}
.store{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);background:var(--surface2);border:1px solid var(--border);
  border-radius:999px;padding:4px 11px;margin:0 auto 18px}
.store{border-color:rgba(0,255,176,.35);background:rgba(0,255,176,.06)}
.store b{color:var(--green);font-weight:700}
.store.weak{border-color:rgba(232,200,64,.4);background:rgba(232,200,64,.07)}
.store.weak b{color:var(--gold)}
.crash{position:fixed;left:8px;right:8px;bottom:8px;z-index:9999;display:none;
  background:rgba(255,107,107,.14);border:1px solid var(--red);border-radius:12px;
  padding:12px 14px;font-family:ui-monospace,monospace;font-size:11px;color:#FFD9D9;
  line-height:1.5;max-height:40vh;overflow:auto;word-break:break-word}
.crash.on{display:block}
#rt{display:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* the armed state of the send button */
.btn.solid.danger{background:linear-gradient(180deg,#E8564A,#C93A2E);
  box-shadow:0 8px 24px rgba(232,86,74,.28)}

/* ══ patch47: консоль на 4 ячейки ══ */
.acts{grid-template-columns:repeat(4,1fr);gap:1px;padding:1px;margin-bottom:22px;
  background:linear-gradient(120deg,rgba(123,92,255,.55),rgba(0,212,255,.35) 55%,rgba(30,42,66,.9));
  clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),
    calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px)}
.act{background:#12182A;padding:15px 2px 12px;gap:8px;font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;font-weight:600;color:#6B82A8;white-space:nowrap;
  position:relative;overflow:hidden}
.act:active{transform:none}
.act::after{content:'';position:absolute;left:50%;bottom:0;width:0;height:70px;
  transform:translateX(-50%);border-radius:50%;filter:blur(18px);background:#7B5CFF;
  opacity:0;transition:width .25s,opacity .25s}
.act:active::after{width:120px;opacity:.5}
.act i{width:auto;height:auto;background:none;border:none;border-radius:0;box-shadow:none;
  position:relative;z-index:1}
.act svg{width:21px;height:21px;stroke:#E8F0FF}
#act-swap{color:#E8F0FF}
#act-swap svg{stroke:#00D4FF}
#act-swap::before{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;z-index:1;
  background:linear-gradient(90deg,transparent,#00D4FF,transparent)}

/* ══ patch47: реклама ══ */
.ads{position:relative;border:1px solid #1E2A42;border-radius:16px;overflow:hidden;
  background:#161E30;margin:0 -10px 22px}
.ads[hidden]{display:none}
.ads-track{display:flex;transition:transform .55s cubic-bezier(.4,.14,.2,1)}
.ad{flex:0 0 100%;min-height:104px;padding:15px 16px 17px;display:flex;flex-direction:column;
  gap:5px;justify-content:center;position:relative;cursor:pointer}
.ad .tag{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:#6B82A8;font-weight:600}
.ad h3{margin:0;font-family:'Rajdhani','Exo 2',sans-serif;font-size:20px;font-weight:600;color:#E8F0FF}
.ad p{margin:0;font-size:12px;color:#A9BBDD;line-height:1.45;max-width:78%}
.ad .glow{position:absolute;right:-40px;top:-40px;width:150px;height:150px;border-radius:50%;
  filter:blur(46px);opacity:.5}
.ad .cta{position:absolute;right:14px;bottom:14px;width:30px;height:30px;border-radius:10px;
  border:1px solid #1E2A42;display:grid;place-items:center;background:rgba(11,15,26,.5)}
.ad .cta svg{width:14px;height:14px;stroke:#E8F0FF;stroke-width:1.8;fill:none;stroke-linecap:round}
.ads-ticks{position:absolute;left:16px;bottom:12px;display:flex;gap:5px;z-index:2}
.ads-ticks .t{width:16px;height:2px;border-radius:2px;background:rgba(107,130,168,.4);overflow:hidden}
.ads-ticks .t i{display:block;height:100%;width:0;background:#00D4FF}
.ads-ticks .t.on i{width:100%;transition:width 6s linear}
.ads-ticks .t.done i{width:100%}
@media (prefers-reduced-motion:reduce){.ads-track{transition:none}.ads-ticks .t.on i{width:100%}}

/* ══ patch48: опорные активы ══ */
.core{display:grid;grid-template-columns:1fr 1px 1fr;border:1px solid #1E2A42;border-radius:16px;
  background:linear-gradient(160deg,rgba(123,92,255,.09),rgba(18,24,42,0) 55%),#12182A;
  overflow:hidden;margin:0 0 22px;position:relative;min-height:96px}
.core::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(123,92,255,.7),rgba(0,212,255,.5),transparent)}
.core-seam{background:linear-gradient(180deg,transparent,#1E2A42 20%,#1E2A42 80%,transparent)}
.core-cell{padding:15px 15px 13px;display:flex;flex-direction:column;gap:3px;min-width:0}
.core-top{display:flex;align-items:center;gap:8px}
.core-top img,.core-top i,.core-top .ic{width:24px;height:24px;border-radius:50%;flex:none;
  display:block;object-fit:cover}
.core-dot{width:24px;height:24px;border-radius:50%;flex:none;
  background:linear-gradient(140deg,#22304C,#161E30);border:1px solid #1E2A42}
.core-sym{font-size:13px;font-weight:600;letter-spacing:.06em;color:#E8F0FF}
.core-usd{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:23px;color:#fff;margin-top:6px}
.core-usd.soft{color:var(--muted)}
.core-qty{font-family:'Rajdhani','Exo 2',sans-serif;font-size:12px;color:var(--muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ══ patch51: экран обмена ══ */
.sw-pane{position:relative;display:flex;flex-direction:column;gap:1px;margin:0 0 14px}
.sw-side{background:#12182A;border:1px solid #1E2A42;border-radius:14px;padding:13px 14px}
.sw-lbl{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);margin-bottom:8px}
.sw-row{display:flex;align-items:center;gap:10px}
.sw-row input{flex:1;min-width:0;background:none;border:0;outline:none;color:#fff;
  font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:26px;padding:0}
.sw-out{flex:1;min-width:0;font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:26px;
  color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sw-out.dim{color:var(--muted)}
.sw-pick{flex:none;background:#161E30;border:1px solid #1E2A42;border-radius:10px;
  color:#E8F0FF;font-family:inherit;font-size:13px;font-weight:600;padding:9px 10px;
  max-width:44%}
/* on the seam between the two cards, whatever their heights: in the flow, with
   negative margins as tall as half the button, not at the middle of the pane */
.sw-flip{position:relative;align-self:center;margin:-19px 0;z-index:2;
  width:38px;height:38px;border-radius:50%;border:1px solid #1E2A42;background:#0B0F1A;
  display:grid;place-items:center;cursor:pointer;padding:0}
.sw-flip svg{width:17px;height:17px;stroke:#00D4FF;stroke-width:1.7;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.sw-flip:active{transform:scale(.92)}
/* room for the half of the flip button that reaches into each card */
.sw-pane>.sw-side:first-child{padding-bottom:24px}
.sw-pane>.sw-side:last-of-type{padding-top:22px}
.sw-detail{min-height:20px;margin:0 4px 14px;display:flex;flex-direction:column;gap:6px}

/* The outcome, which used to look exactly like the quote it replaced. */
.sw-result{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:14px;
  background:var(--surface2);border:1px solid var(--border);
  animation:sw-in .2s ease-out both}
.sw-result.done{border-color:rgba(0,255,176,.35);
  background:linear-gradient(180deg,rgba(0,255,176,.07),transparent 70%),var(--surface2)}
.sw-result-top{display:flex;align-items:center;gap:10px;font-size:15px;color:#E8F0FF}
.sw-result-top b{font-weight:600}
.sw-tick{width:20px;height:20px;flex:none;fill:none;stroke:#00FFB0;stroke-width:2.5;
  stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:26;stroke-dashoffset:26;animation:sw-draw .35s ease-out .05s forwards}
.sw-result p{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}
.sw-result a{font-family:'Rajdhani','Exo 2',sans-serif;font-size:12px;letter-spacing:.04em;
  color:var(--accent2);text-decoration:none;word-break:break-all}
.sw-result a:hover{text-decoration:underline}
@keyframes sw-draw{to{stroke-dashoffset:0}}
@keyframes sw-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .sw-result{animation:none}.sw-tick{animation:none;stroke-dashoffset:0}}
.sw-line{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.sw-line b{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:600;color:#E8F0FF}
.sw-line.warn b{color:var(--gold)}
.sw-line.bad b{color:var(--red)}

/* the asset being sent, chosen the same way the swap screen chooses one */
.sd-pick{display:flex;align-items:center;gap:10px;width:100%;padding:11px 14px;
  border-radius:14px;background:var(--surface2);border:1px solid var(--border);
  color:var(--text);font:inherit;cursor:pointer;transition:border-color .15s}
.sd-pick:hover{border-color:var(--accent2)}
.sd-pick b{flex:1;text-align:left;font-size:15px;font-weight:600;letter-spacing:.03em}
.sd-pick svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--muted);
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sd-ico .sym{width:26px;height:26px;font-size:12px}

/* ---- confirm ---- */
/* What is being paid and what comes back, before anything else on the panel.
   The numbers a person checks are the two amounts; everything under them is
   detail they may or may not read. */
.cf-pair{display:flex;align-items:center;gap:12px;margin:2px 0 14px;
  padding:14px;border-radius:14px;background:var(--surface2);border:1px solid var(--border)}
.cf-side{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px;
  text-align:center}
.cf-side b{font-size:16px;font-weight:600;color:#E8F0FF;word-break:break-all;line-height:1.3}
.cf-side i{font-family:'Rajdhani','Exo 2',sans-serif;font-style:normal;font-size:12px;color:var(--muted)}
.cf-ico .sym{width:34px;height:34px;font-size:14px}
.cf-arrow{width:20px;height:20px;flex:none;fill:none;stroke:var(--accent2);
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#cf-lines{margin:0 2px 16px}
/* a swap that costs five percent should not be one tap from an ordinary one */
#cf-go.risky{background:linear-gradient(135deg,#FF6B8A,#C2255C)}

/* ---- receive ---- */
/* The code sits on white because that is what a camera expects; every other
   surface here is dark, so it gets a card of its own rather than a hole. */
.qr{display:flex;align-items:center;justify-content:center;
  width:min(260px,68vw);aspect-ratio:1;margin:22px auto 18px;
  background:#fff;border-radius:18px;padding:12px;
  box-shadow:0 12px 40px -18px rgba(0,212,255,.5)}
.qr svg{width:100%;height:100%;display:block}
.qr .spin{border-top-color:#12182A;border-color:rgba(0,0,0,.15);border-top-color:#12182A}
.rc-addr{margin:0 auto 18px;max-width:340px;padding:12px 14px;border-radius:12px;
  background:var(--surface2);border:1px solid var(--border);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.7;
  color:var(--text);word-break:break-all;text-align:center}

/* the header address is a button now, and must not look like one */
button.waddr{background:none;border:0;padding:0;font:inherit;color:inherit;
  cursor:pointer;text-align:left}
button.waddr:active{opacity:.6}
/* the one figure on the review screen that is a promise */
.sw-line.big{align-items:baseline;margin:2px 0 4px}
.sw-line.big span{font-size:13px;color:#E8F0FF}
.sw-line.big b{font-size:20px;letter-spacing:.01em}
/* a sentence under a number, for when the number alone would mislead */
.sw-note{margin:-2px 0 4px;font-size:11px;line-height:1.5;color:var(--muted)}

.sw-slip{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0 4px 16px;font-size:12px;color:var(--muted)}
.sw-slip-opts{display:flex;gap:6px}
.sw-slip-opts button{padding:5px 10px;border-radius:9px;cursor:pointer;
  background:var(--surface2);border:1px solid var(--border);color:var(--muted);
  font-family:'Rajdhani','Exo 2',sans-serif;font-size:12px;letter-spacing:.04em;
  transition:color .12s,border-color .12s,background .12s}
.sw-slip-opts button:hover{color:var(--text)}
.sw-slip-opts button.on{color:var(--text);border-color:var(--accent2);
  background:rgba(0,212,255,.1)}

/* ══ patch53: выбор токена и бегунок ══ */
.sw-pick{display:flex;align-items:center;gap:7px;flex:none;max-width:46%;
  background:#161E30;border:1px solid #1E2A42;border-radius:12px;
  color:#E8F0FF;font-family:inherit;font-size:13px;font-weight:600;
  padding:7px 9px;cursor:pointer}
.sw-pick img,.sw-pick .ic,.sw-pick i{width:22px;height:22px;border-radius:50%;flex:none;display:block}
.sw-pick span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sw-caret{width:14px;height:14px;flex:none;stroke:var(--muted);stroke-width:2;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.sw-pick:active{border-color:#00D4FF}

.sw-range{-webkit-appearance:none;appearance:none;width:100%;height:22px;margin:12px 0 0;
  background:none;cursor:pointer}
.sw-range::-webkit-slider-runnable-track{height:3px;border-radius:3px;
  background:linear-gradient(90deg,#7B5CFF,#00D4FF)}
.sw-range::-moz-range-track{height:3px;border-radius:3px;
  background:linear-gradient(90deg,#7B5CFF,#00D4FF)}
.sw-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;
  border-radius:50%;background:#0B0F1A;border:2px solid #00D4FF;margin-top:-8px;
  box-shadow:0 0 10px -2px #00D4FF}
.sw-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#0B0F1A;
  border:2px solid #00D4FF}
.sw-pcts{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}
.sw-pct{background:#161E30;border:1px solid #1E2A42;border-radius:9px;color:var(--muted);
  font-family:inherit;font-size:11px;font-weight:600;letter-spacing:.06em;padding:7px 2px;cursor:pointer}
.sw-pct:active{color:#E8F0FF;border-color:#00D4FF}

.sw-sheet{position:fixed;inset:0;z-index:50;background:rgba(6,9,16,.72);
  display:flex;align-items:flex-end;backdrop-filter:blur(3px)}
.sw-sheet[hidden]{display:none}
/* The sheet used to be a flat panel with a browser scrollbar down its side.
   It reads as part of the app now: a lit top edge where it meets the dim
   screen behind it, a grab handle that says which way it closes, and a track
   that belongs to the same palette as everything else. */
.sw-sheet-in{width:100%;max-width:520px;margin:0 auto;
  background:linear-gradient(180deg,#18203A 0,var(--surface) 120px);
  border-top:1px solid rgba(0,212,255,.28);border-radius:22px 22px 0 0;
  box-shadow:0 -20px 50px -20px rgba(0,0,0,.8),0 -1px 0 rgba(123,92,255,.35);
  padding:10px 16px calc(18px + env(safe-area-inset-bottom,0px));
  max-height:78vh;display:flex;flex-direction:column;
  animation:sw-up .22s cubic-bezier(.2,.9,.3,1) both}
.sw-sheet-in::before{content:'';display:block;width:38px;height:4px;flex:none;
  margin:2px auto 10px;border-radius:2px;background:var(--border)}
@keyframes sw-up{from{transform:translateY(14%)}to{transform:none}}

/* A bottom sheet is the right shape on a phone, where the bottom edge is where
   the thumb is and the screen ends at the sheet. On a desktop window it just
   presses the last row against the border of the display - which is what read
   as the list being cut off. Wide enough for a dialog, it becomes one: centred,
   rounded on every corner, and never touching an edge. */
@media (min-width:720px) and (min-height:560px){
  .sw-sheet{align-items:center;padding:24px}
  .sw-sheet-in{border-radius:20px;border:1px solid rgba(0,212,255,.22);
    border-top-color:rgba(0,212,255,.28);
    background:linear-gradient(180deg,#18203A 0,var(--surface) 140px);
    padding:14px 16px 12px;max-height:min(70vh,620px);
    animation-name:sw-fade}
  /* the handle says "drag me down", which is not what a dialog does */
  .sw-sheet-in::before{display:none}
}
@keyframes sw-fade{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
/* flex:none, or the header shares the squeeze with the list and the whole
   column drifts. It is furniture; only the list is allowed to give. */
.sw-sheet-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;
  flex:none;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.sw-x{background:none;border:0;color:#00D4FF;font-family:inherit;font-size:12px;
  font-weight:600;cursor:pointer;padding:4px}
#sw-count{font-family:'Rajdhani','Exo 2',sans-serif;font-size:11px;letter-spacing:.08em;
  color:var(--muted);text-transform:none}

/* A ticker is short and the list is long, so the field earns its place the
   moment there is more than a screenful. */
.sw-find{position:relative;display:flex;align-items:center;margin:2px 0 10px;flex:none}
.sw-find-i{position:absolute;left:11px;width:15px;height:15px;pointer-events:none;
  stroke:var(--muted);stroke-width:2;fill:none;stroke-linecap:round}
.sw-find input{width:100%;background:var(--surface2);border:1px solid var(--border);
  border-radius:11px;padding:10px 12px 10px 34px;color:var(--text);
  font-family:inherit;font-size:14px;outline:none;transition:border-color .15s}
.sw-find input::placeholder{color:var(--muted)}
.sw-find input:focus{border-color:var(--accent2)}

/* Firefox takes the two-value form; WebKit needs the pseudo-elements. Both say
   the same thing: a thin track in the app's own colours instead of the
   platform's grey bar down the middle of the sheet. */
/* min-height:0 is the whole fix. A flex child will not shrink below its own
   content unless told it may, so the list ignored the sheet's max-height, the
   sheet grew past the screen, and its last rows went under the bottom edge.
   Every other value here was already right. */
.sw-list{overflow-y:auto;display:flex;flex-direction:column;
  flex:1 1 auto;min-height:0;
  scrollbar-width:thin;scrollbar-color:var(--border) transparent;
  overscroll-behavior:contain}
.sw-list{padding-bottom:4px;scroll-padding-block-end:8px}
.sw-list::-webkit-scrollbar{width:4px}
.sw-list::-webkit-scrollbar-track{background:transparent}
.sw-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.sw-list::-webkit-scrollbar-thumb:hover{background:var(--accent2)}
.sw-item{display:flex;align-items:center;gap:11px;width:100%;background:none;border:0;
  border-bottom:1px solid rgba(30,42,66,.6);padding:11px 8px;cursor:pointer;
  font-family:inherit;color:#E8F0FF;text-align:left;border-radius:10px;
  transition:background .12s}
.sw-item:last-child{border-bottom:0}
.sw-item:hover{background:rgba(22,30,48,.55)}
.sw-item:active{background:rgba(22,30,48,.9)}
.sw-item img,.sw-item .ic,.sw-item i{width:30px;height:30px;border-radius:50%;flex:none;display:block}
/* a row, so the tag sits beside the ticker instead of after it in the text
   flow - where it wrapped, and then wrapped again inside itself */
.sw-item-s{flex:1;min-width:0;display:flex;align-items:center;gap:7px;
  font-size:14px;font-weight:600;letter-spacing:.03em}
.sw-hop{flex:none;white-space:nowrap;padding:1px 6px;border-radius:6px;
  font-family:'Rajdhani','Exo 2',sans-serif;font-weight:500;font-size:10px;letter-spacing:.06em;
  color:var(--muted);background:var(--surface2);border:1px solid var(--border);
  vertical-align:middle}
.sw-item-r{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:0}
.sw-item-v{font-family:'Rajdhani','Exo 2',sans-serif;font-size:13px;color:var(--muted)}
.sw-item-u{font-family:'Rajdhani','Exo 2',sans-serif;font-size:12px;color:#00FFB0}
.sw-item-u:empty,.sw-item-v:empty{display:none}
.sw-none{padding:18px 4px;font-size:13px;line-height:1.5;color:var(--muted);text-align:center}

/* ══ patch55: кнопки обмена внизу экрана ══
   Поля читаются сверху вниз, а действие ждёт там, где его ищет большой палец.
   Пустота между ними принадлежит экрану, а не кнопке. */
/* An id beats .step{display:none}, so this has to say when, not just how -
   otherwise the swap screen is drawn on top of every other tab. */
#st-swap.on{display:flex;flex-direction:column}
#st-swap #sw-note{margin:0 4px 14px}
#st-swap #sw-go{margin-top:auto}
#st-swap .btn.quiet{margin-top:10px}

/* ══ patch58: зоны проскальзывания ══
   Дорожка бегунка красится по пулу, а не по балансу: докуда сделка дёшева,
   докуда терпима, и где начинается потеря. Это видно пальцем, до всяких цифр. */
.sw-range::-webkit-slider-runnable-track{
  background:var(--sw-zones,linear-gradient(90deg,#7B5CFF,#00D4FF))}
.sw-range::-moz-range-track{
  background:var(--sw-zones,linear-gradient(90deg,#7B5CFF,#00D4FF))}
/* Sits directly under the amount it describes, in the quiet weight - the
   number above is the one being typed, this one only says what it means. */
.sw-usd{font-family:'Rajdhani','Exo 2',sans-serif;font-size:13px;color:var(--muted);
  margin-top:2px;min-height:17px;letter-spacing:.02em}
.sw-usd:empty{min-height:0}

.sw-hint{margin-top:9px;font-size:11px;line-height:1.4;color:var(--muted)}
.sw-hint b{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:600;color:#00FFB0}

/* ══ patch59: история ══ */
/* The date, which a flat column of rows hides and a reader is always looking
   for. Sticky, so it is still there once the list has been scrolled into. */
.ac-day{position:sticky;top:0;z-index:2;margin:18px 0 2px;padding:6px 4px;
  font-family:'Rajdhani','Exo 2',sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  background:linear-gradient(180deg,var(--bg) 65%,transparent)}
.ac-day:first-child{margin-top:2px}
.ac-row{display:flex;align-items:center;gap:12px;padding:12px 4px;
  border-bottom:1px solid rgba(30,42,66,.6);cursor:pointer}
.ac-row:last-child{border-bottom:0}
.ac-row:active{background:rgba(22,30,48,.7)}
/* The badge, which is the only thing on this screen a person reads without
   reading. A rounded square with a grey outline says nothing; a disc lit from
   inside in the colour of what happened says it before the words do. */
.ac-mark{--tint:#7B8AA5;width:40px;height:40px;border-radius:50%;flex:none;
  display:grid;place-items:center;position:relative;
  background:radial-gradient(circle at 32% 26%,
    color-mix(in srgb, var(--tint) 26%, transparent), transparent 68%), #131A2B;
  border:1px solid color-mix(in srgb, var(--tint) 32%, transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),
             0 8px 18px -12px color-mix(in srgb, var(--tint) 70%, transparent)}
.ac-mark svg{width:19px;height:19px;stroke:var(--tint);stroke-width:1.6;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.ac-mark.in{--tint:#00FFB0}
.ac-mark.out{--tint:#FF6B8A}
.ac-mark.swap{--tint:#00D4FF}
.ac-mark.stake{--tint:#7B5CFF}
.ac-mark.gift{--tint:#E8C840}
.ac-mark.code{--tint:#7B8AA5}
/* failure is a mark on the badge rather than a recolouring of it: what the
   transaction was and whether it worked are two different facts */
.ac-mark.fail::after{content:'';position:absolute;right:-1px;bottom:-1px;
  width:13px;height:13px;border-radius:50%;background:var(--red);
  border:2px solid var(--bg);
  -webkit-mask:linear-gradient(#000,#000);mask:none}
.ac-mark.fail{--tint:#FF6B8A}

/* older engines ignore color-mix and would render no tint at all */
@supports not (color: color-mix(in srgb, red 50%, transparent)){
  .ac-mark{background:#161E30;border-color:#1E2A42}
}
.ac-mid{flex:1;min-width:0}
.ac-t{font-size:14px;font-weight:600;letter-spacing:.02em}
.ac-s{font-size:11px;color:var(--muted);font-family:'Rajdhani','Exo 2',sans-serif;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ac-r{text-align:right;flex:none}
.ac-v{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:15px}
.ac-v.in{color:#00FFB0}
.ac-w{font-size:10px;color:var(--muted);font-family:'Rajdhani','Exo 2',sans-serif}
.ac-bad{color:var(--red);font-size:11px;font-family:'Rajdhani','Exo 2',sans-serif}

/* ---- one transaction ---- */
.tx-body{overflow-y:auto;min-height:0;flex:1;scrollbar-width:thin;
  scrollbar-color:var(--border) transparent}
.tx-head{display:flex;align-items:center;gap:12px;margin:2px 0 14px}
.tx-head b{display:block;font-size:16px;font-weight:600;color:#E8F0FF}
.tx-head i{display:block;font-style:normal;font-size:11px;color:var(--muted);
  font-family:'Rajdhani','Exo 2',sans-serif;margin-top:2px}
.tx-line{display:flex;justify-content:space-between;gap:12px;padding:7px 0;
  font-size:12px;color:var(--muted);border-bottom:1px solid rgba(30,42,66,.5)}
.tx-line b{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:600;color:#E8F0FF;
  text-align:right;word-break:break-all}
.tx-line.in b{color:#00FFB0}
.tx-line.out b{color:#FF6B8A}
.tx-who{margin:-2px 0 6px;font-size:11px;color:var(--muted);
  font-family:'Rajdhani','Exo 2',sans-serif;text-align:right}
.tx-moves{margin-bottom:8px}
.tx-fail{margin:0 0 12px;padding:11px 13px;border-radius:12px;font-size:12px;line-height:1.5;
  color:#FFB3C4;background:rgba(255,107,138,.08);border:1px solid rgba(255,107,138,.3)}
.tx-fail p{margin:6px 0 0;font-family:ui-monospace,monospace;font-size:11px;
  color:var(--muted);word-break:break-all}
.tx-hash{margin:12px 0 4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;line-height:1.6;color:var(--muted);word-break:break-all}
.tx-acts{display:flex;gap:10px;margin:12px 0 0}
.tx-acts .btn{flex:1;margin:0}

/* ══ patch62: баланс во время пересчёта ══
   Приглушённый - значит «это прошлая цифра, идёт проверка». Не спиннер:
   число остаётся читаемым, потому что оно всё ещё верное. */
.bal-value.stale{color:var(--muted);transition:color .35s ease}

/* ══ patch67: NFT ══
   Префикс hm-, потому что .seg уже занят экраном создания кошелька. */
.hm-seg{display:flex;border:1px solid var(--border);border-radius:12px;overflow:hidden;
  background:var(--surface);margin:0 0 14px}
.hm-seg-b{flex:1;background:none;border:0;color:var(--muted);font-family:inherit;font-weight:600;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:11px 6px;cursor:pointer;
  position:relative;transition:color .18s}
.hm-seg-b.on{color:#E8F0FF}
.hm-seg-b.on::after{content:'';position:absolute;left:14%;right:14%;bottom:0;height:2px;
  background:linear-gradient(90deg,#7B5CFF,#00D4FF)}
.hm-seg-n{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;margin-left:6px;color:var(--muted)}

.nft-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:14px}
.nft-card{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface)}
.nft-art{aspect-ratio:1;position:relative;background:linear-gradient(150deg,#1B2338,#12182A);
  display:grid;place-items:center;overflow:hidden}
.nft-art img{width:100%;height:100%;object-fit:cover;display:block}
.nft-art .ph{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:26px;color:#2C3A57}
.nft-meta{padding:9px 10px 11px;min-width:0}
.nft-id{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nft-col{font-size:10px;color:var(--muted);letter-spacing:.06em;margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ══ patch68: широкое окно ══
   Одна ширина на всё приложение. Панель вкладок раньше растягивалась на весь
   экран, потому что прибита к краям - на телефоне это одно и то же, на
   десктопе колонка оказывалась по центру, а вкладки по углам. */
:root{--app-w:520px}
.tabs{left:50%;right:auto;transform:translateX(-50%);
  width:100%;max-width:var(--app-w)}
.step{max-width:var(--app-w)}

/* Десктопный вебвью Telegram отдаёт окно шире видимой части, поэтому 100%
   центрирует по тому, чего не видно. Правильная величина - ширина вьюпорта,
   ту же пару у высоты приложение уже использует. */
body{width:100%;max-width:100vw;margin:0 auto}
.tabs{max-width:min(var(--app-w),100vw)}

/* ---------------- P2P market ----------------
   The widget fills the screen under a thin header. The height follows the
   Telegram viewport, the same variable .step uses. */
#st-p2p{padding:10px 10px 0;display:none;flex-direction:column}
#st-p2p.on{display:flex}
.p2p-top{display:flex;align-items:center;gap:12px;margin:0 4px 10px;flex:none}
.p2p-top h2{margin:0;font-size:17px}
.p2p-frame{flex:1;min-height:calc(var(--tg-viewport-stable-height, 100vh) - 64px);
  border-radius:16px;overflow:hidden;border:1px solid var(--border);background:var(--surface)}
.p2p-frame iframe{display:block;width:100%;height:calc(var(--tg-viewport-stable-height, 100vh) - 66px);border:0}
.p2p-frame .empty{padding:40px 0;text-align:center;color:var(--muted)}
.p2p-lines{display:flex;flex-direction:column;gap:1px;border-radius:12px;overflow:hidden;
  border:1px solid var(--border);margin-bottom:10px;flex:none}
.p2p-line{display:flex;justify-content:space-between;gap:14px;padding:10px 12px;background:var(--surface2);
  font-size:13px;line-height:1.45}
.p2p-line span{color:var(--muted);flex:none}
.p2p-line b{font-weight:600;color:var(--text);text-align:right;word-break:break-word}
#p2p-left{text-transform:none;letter-spacing:0;font-size:11px}
#p2p-sheet .sw-sheet-in{overflow-y:auto}

/* Noble USDC notice on the home screen */
.warn.sunset[hidden]{display:none}
.warn.sunset{position:relative;display:flex;flex-direction:column;gap:4px;padding-right:34px;margin:12px 0}
.warn.sunset b{font-weight:600}
.warn.sunset span{line-height:1.5}
.warn.sunset a{color:var(--accent);text-decoration:underline;align-self:flex-start}
.sunset-x{position:absolute;top:6px;right:8px;width:24px;height:24px;border:0;background:none;
  color:inherit;opacity:.6;font-size:18px;line-height:1;cursor:pointer}

/* ---------------- staking ---------------- */
.stk-acts{display:flex;gap:10px;margin-bottom:14px}
.stk-acts .btn{flex:1;margin:0}
.stk-acts .btn[disabled]{opacity:.45}
.stk-row{flex-wrap:wrap;cursor:pointer}
.stk-row.open{border-color:var(--accent)}
.stk-row-acts{flex-basis:100%;display:flex;gap:8px;padding-top:10px;margin-top:4px;border-top:1px solid var(--border)}
.stk-row-acts .dust{flex:1;padding:8px 0}
.stk-ico{background:var(--surface2);color:var(--muted);font-weight:700}
.stk-flag{font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);
  border:1px solid var(--border);border-radius:6px;padding:1px 5px;margin-left:4px;vertical-align:middle}
.stk-flag.bad{color:var(--red);border-color:var(--red)}
.stk-sort{display:flex;gap:6px;margin:10px 0}
.stk-vals{display:flex;flex-direction:column;gap:0}
button.row.stk-val{width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer}
/* The header stays put and only the body scrolls: when the whole panel
   scrolled, Close went off the top with the list and the sheet could not be
   shut. */
#stk-sheet-body{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))}
.stk-ico{overflow:hidden}
.stk-ico img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}

/* ---------------- staking screen ---------------- */
.stk-cap{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.stk-big{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:34px;line-height:1;color:#fff}
.stk-big small{font-family:'Exo 2',sans-serif;font-size:15px;font-weight:500;color:var(--muted)}
.stk-hero{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);padding:18px;
  display:flex;flex-direction:column;gap:16px;margin-bottom:14px}
.stk-hero-top{display:flex;align-items:center;gap:16px}
.stk-ring{position:relative;width:112px;height:112px;flex:none}
.stk-ring-in{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.stk-ring-in b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:24px;line-height:1}
.stk-ring-in small{font-size:10px;color:var(--muted)}
.stk-hero-num{display:flex;flex-direction:column;gap:5px;min-width:0}
.stk-hero-num small{font-size:13px;color:var(--muted)}
.stk-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stk-tiles div{background:var(--surface2);border-radius:14px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.stk-tiles small{font-size:11px;color:var(--muted)}
.stk-tiles b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.g{color:var(--green)}.c{color:var(--accent2)}
.stk-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--muted)}
.stk-legend span{display:flex;align-items:center;gap:6px}
.stk-legend i{width:8px;height:8px;border-radius:2px;display:inline-block}
.stk-legend i.free{background:var(--border);box-shadow:inset 0 0 0 1px #33466B}
.stk-bigacts{display:flex;gap:10px}
.stk-bigact{flex:1 1 0;min-height:66px;background:var(--surface);border:1px solid var(--border);border-radius:16px;
  color:var(--text);font-family:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;padding:8px 4px}
.stk-bigact svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.stk-bigact b{font-size:13px;font-weight:600}
.stk-bigact small{font-size:11px;color:var(--muted)}
.stk-bigact small.g{color:var(--green)}
.stk-bigact.main{background:var(--accent);border-color:var(--accent);color:#fff}
.stk-bigact[disabled]{opacity:.45;cursor:default}
.stk-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:14px;margin-bottom:10px;cursor:pointer;
  display:flex;flex-direction:column;gap:12px}
.stk-card.open{border-color:var(--accent)}
.stk-card.bad{border-color:rgba(255,107,107,.45)}
.stk-card-top{display:flex;align-items:center;gap:12px}
.stk-card-top .stk-ico{width:44px;height:44px;flex:none}
.stk-card-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.stk-card-name{display:flex;align-items:center;gap:8px;min-width:0}
.stk-card-name span{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stk-card-name em{font-style:normal;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:6px;padding:2px 6px;flex:none}
.stk-card-name em.ok{color:var(--green);background:rgba(0,255,176,.10)}
.stk-card-name em.bad{color:#FF8A8A;background:rgba(255,107,107,.12)}
.stk-card-mid small{font-size:12px;color:var(--muted)}
.stk-card-val{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.stk-card-val b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:18px}
.stk-card-val small{font-size:12px}
.stk-card-warn{font-size:12px;color:#FF8A8A}
.stk-card .stk-row-acts{border-top:1px solid var(--border);padding-top:10px;margin:0}
.stk-bar{height:4px;border-radius:2px;background:var(--border);overflow:hidden}
.stk-bar i{display:block;height:100%;background:var(--accent);border-radius:2px}
.stk-card.bad .stk-bar i{background:var(--red)}
.stk-bar.c{height:6px}.stk-bar.c i{background:var(--accent2)}
.stk-unb{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:14px;margin-bottom:10px;display:flex;flex-direction:column;gap:9px}
.stk-unb-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.stk-unb-top b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:18px}
.stk-unb small{font-size:12px;color:var(--muted)}
.stk-hero-empty{border-color:#2A2F5A}
.stk-hero-empty p{margin:0;font-size:14px;line-height:1.55;color:#C6D3EA}
.stk-hero-empty .btn{margin:0}
.stk-apr-line{font-size:13px;color:var(--muted)}.stk-apr-line b{color:var(--text)}
.stk-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stk-steps div{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:5px}
.stk-steps span{width:24px;height:24px;border-radius:50%;background:var(--border);color:#B9A8FF;font-family:'Rajdhani','Exo 2',sans-serif;
  font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center}
.stk-steps b{font-size:14px}.stk-steps small{font-size:12px;color:var(--muted)}
.stk-wd{text-align:left;margin:10px 4px 0;color:var(--gold)}

/* ---------------- governance ---------------- */
button.row.gov-row{width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer}
.gov-row .row-name{white-space:normal;line-height:1.35}
.gov-mine{color:var(--green);font-weight:600}
.gov-todo{color:var(--accent);font-weight:600}
.gov-ok{color:var(--green)}
.gov-bad{color:var(--muted)}
.gov-st-passed{color:var(--green)}.gov-st-rejected,.gov-st-failed{color:var(--red)}
.gov-st-voting{color:var(--accent)}.gov-st-deposit{color:var(--muted)}
.gov-bar{display:flex;height:6px;border-radius:3px;overflow:hidden;background:var(--surface2);margin:8px 0 4px}
.gov-bar i{display:block;height:100%}
.gov-bar .y,.gov-legend .y::before{background:#3ecf8e}
.gov-bar .n,.gov-legend .n::before{background:#f06a6a}
.gov-bar .v,.gov-legend .v::before{background:#b04ae8}
.gov-bar .a,.gov-legend .a::before{background:#8a93a6}
.gov-legend{display:flex;flex-wrap:wrap;gap:10px;font-size:11px;color:var(--muted)}
.gov-legend span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:4px}
.gov-title{margin:0 0 10px;font-size:16px;line-height:1.35}
.gov-text{white-space:pre-wrap;word-break:break-word;font-size:13px;line-height:1.55;color:var(--text);
  background:var(--surface2);border-radius:12px;padding:12px;margin:10px 0}
.gov-text.clip{max-height:220px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 70%,transparent)}
.gov-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 10px}
.gov-opt{padding:12px 0}
.gov-opt.on{border-color:var(--accent);color:var(--accent)}
#gov-sheet-body{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))}
#st-gov .warn a{color:var(--accent)}
.tab{position:relative}
.tab-badge{position:absolute;top:4px;left:calc(50% + 6px);min-width:16px;height:16px;padding:0 4px;border-radius:8px;
  background:var(--surface2);color:var(--text);font-size:10px;font-weight:700;line-height:16px;text-align:center}
.tab-badge.todo{background:var(--accent);color:#fff}
.gov-voters{display:flex;flex-direction:column;gap:6px}
.gov-voters .gov-voter.more{display:none}
.gov-voters.all .gov-voter.more{display:block}
.gov-voter{background:var(--surface2);border-radius:10px;padding:8px 10px}
.gov-voter-top{display:flex;align-items:center;gap:8px;font-size:13px}
.gov-rank{color:var(--muted);font-size:11px;min-width:18px}
.gov-who{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gov-vp{color:var(--muted);font-size:11px}
.gov-v{font-size:11px;font-weight:600;padding:2px 6px;border-radius:6px;white-space:nowrap}
.gov-v.y{color:#3ecf8e;background:rgba(62,207,142,.12)}.gov-v.n{color:#f06a6a;background:rgba(240,106,106,.12)}
.gov-v.v{color:#c77dff;background:rgba(176,74,232,.14)}.gov-v.a{color:#a7b0c2;background:rgba(138,147,166,.14)}
.gov-v.none{color:var(--muted);font-weight:500}
.gov-memo{margin-top:6px;font-size:12.5px;line-height:1.5;white-space:pre-wrap;word-break:break-word;color:var(--text)}
#gov-memo{width:100%;box-sizing:border-box;resize:vertical;font:inherit}
body.sheet-open .tabs{visibility:hidden}
/* while the keyboard is up (swipe.js) */
body.kb-open .tabs{visibility:hidden}
.gov-link{color:var(--accent);text-decoration:underline;word-break:break-all}

/* ══ GRAM swap: Cross-chain card + maker screen ══ */
.xc{display:block;width:100%;text-align:left;font-family:inherit;color:var(--text);cursor:pointer;
  background:linear-gradient(135deg,rgba(0,152,234,.14),rgba(123,92,255,.10) 60%,var(--surface));
  border:1px solid rgba(0,152,234,.35);border-radius:var(--r-card);padding:12px 14px 13px;margin:-8px 0 20px;
  transition:transform .12s}
.xc[hidden]{display:none}
.xc:active{transform:scale(.98)}
.xc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.xc-label{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600}
.xc-badge{font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--gold);
  border:1px solid rgba(232,200,64,.45);border-radius:999px;padding:2px 8px}
.p2p-top .xc-badge{margin-left:auto}
.xc-main{display:flex;align-items:center;gap:12px}
.xc-ico{display:flex;flex:none}
.xc-ico .sym{width:30px;height:30px;font-size:13px}
.xc-ico .sym+.sym{margin-left:-9px;box-shadow:0 0 0 2px var(--surface)}
.xc-txt{display:flex;flex-direction:column;min-width:0;flex:1}
.xc-txt b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:17px;color:#fff;line-height:1.2}
.xc-txt span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xc-go{width:18px;height:18px;flex:none;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round}
.gx-intro{font-size:12.5px;color:var(--muted);line-height:1.6;margin:4px 4px 14px}
.gx-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 4px 6px;font-size:12.5px;color:var(--muted)}
.gx-bar b{color:var(--text);margin-left:6px}
.gx-bar i{display:block;font-style:normal;font-size:11px;opacity:.75}
.gx-list{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.gx-item{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-row);padding:11px 12px}
.gx-l{flex:1;min-width:0;font-size:13px;color:var(--muted)}
.gx-l b{color:var(--text)}
.gx-l span{display:block;font-size:11.5px;margin-top:2px;line-height:1.5}
.gx-none{font-size:12.5px;color:var(--muted);margin:0 4px}
.gx-tag{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;border-radius:999px;padding:2px 8px;
  border:1px solid var(--border);color:var(--muted);flex:none}
.gx-tag.pending{color:var(--gold);border-color:rgba(232,200,64,.45)}
.gx-tag.locked{color:var(--green);border-color:rgba(0,255,176,.35)}
.gx-tag.unanswered{color:var(--red);border-color:rgba(255,107,107,.4)}
.gx-rates{display:flex;flex-direction:column;gap:2px;margin:-2px 2px 12px;padding:0 0 12px;border-bottom:1px solid var(--border)}
.gx-rates b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:17px;color:#fff}
.gx-rates span{font-size:11.5px;color:var(--muted)}
.gx-amt{background:var(--surface2);border:1px solid var(--border);border-radius:16px;padding:12px 14px}
.gx-amt:focus-within{border-color:rgba(123,92,255,.6)}
.gx-amt-top{display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);font-weight:600;min-height:24px}
.gx-mkt{letter-spacing:0;text-transform:none;font-weight:500;font-size:11.5px}
.gx-amt-in{display:flex;align-items:center;gap:10px;margin-top:4px}
.gx-amt-in input[type=text]{flex:1;min-width:0;background:none;border:0;padding:2px 0;font-family:'Rajdhani','Exo 2',sans-serif;
  font-size:28px;font-weight:700;color:#fff;box-shadow:none}
.gx-amt-in input[type=text]:focus{box-shadow:none}
.gx-tok{display:flex;align-items:center;gap:7px;flex:none;font-weight:700;font-size:14px;color:var(--text);
  background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:999px;padding:5px 11px 5px 5px}
.gx-tok .sym{width:24px;height:24px;font-size:11px}
.gx-swap-ico{display:flex;justify-content:center;margin:-7px 0;position:relative;z-index:1}
.gx-swap-ico svg{width:30px;height:30px;padding:6px;border-radius:50%;background:var(--surface);border:1px solid var(--border);
  stroke:var(--accent2);fill:none;stroke-width:2;stroke-linecap:round}
.gx-chips{display:flex;gap:6px;margin-top:10px}
.gx-chip{font-family:inherit;font-size:12px;font-weight:600;color:var(--muted);background:transparent;cursor:pointer;
  border:1px solid var(--border);border-radius:999px;padding:5px 12px}
.gx-chip.on{color:#fff;border-color:var(--accent);background:rgba(123,92,255,.18)}
.gx-chip:disabled{opacity:.35;cursor:not-allowed}
.gx-amt-top .gx-chip{padding:2px 10px;font-size:11px;letter-spacing:.06em}
.gx-ton{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);margin:14px 2px 0}
.gx-ton b{color:var(--text);font-weight:600}
.gx-ton[hidden],.gx-ton-edit[hidden]{display:none}
.gx-ton-edit{margin:14px 0 0}
.gx-link{margin-left:auto;background:none;border:0;color:var(--accent2);font-family:inherit;font-size:12px;cursor:pointer}
.gx-more{margin-top:14px;font-size:12.5px;color:var(--muted)}
.gx-more summary{cursor:pointer;list-style:none}
.gx-more summary::before{content:'+ '}
.gx-more[open] summary::before{content:'‘2 '}
.gx-sum{margin-top:14px;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;gap:1px}
.gx-sum[hidden]{display:none}
.gx-sum div{display:flex;justify-content:space-between;gap:12px;padding:9px 12px;background:var(--surface2);font-size:12.5px}
.gx-sum span{color:var(--muted);flex:none}
.gx-sum b{color:var(--text);text-align:right;font-weight:600}
.gx-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);padding:16px 14px 14px;margin-bottom:10px}
.gx-msg{font-size:12.5px;color:var(--muted);min-height:18px;margin:8px 4px 0;word-break:break-word}
.gx-msg.bad{color:var(--red)}
.gx-raw{margin-top:10px;font-size:11.5px;color:var(--muted)}
.gx-raw summary{cursor:pointer}
.gx-raw pre{white-space:pre-wrap;word-break:break-all;background:var(--surface2);border-radius:10px;padding:10px;margin-top:6px;
  font-size:10.5px;color:var(--text)}
.gx-item .gx-answer{width:auto;flex:none;margin:0;padding:8px 14px;font-size:12.5px;border-radius:999px}
.xc-n{margin-left:auto;margin-right:8px;min-width:20px;height:20px;border-radius:999px;background:var(--red);color:#fff;
  font-size:11px;font-weight:700;display:grid;place-items:center;padding:0 6px;animation:xcPulse 1.6s ease-in-out infinite}
.xc-n[hidden]{display:none}
@keyframes xcPulse{50%{box-shadow:0 0 0 6px rgba(255,107,107,.18)}}
@keyframes gxDrop{from{transform:translateY(-14px);opacity:0}}
.gx-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.gx-rec{font-size:11.5px;color:var(--muted)}
.gx-deal{align-items:flex-start}
.gx-steps{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap}
.gx-steps span{font-size:10.5px;padding:3px 8px;border-radius:999px;border:1px solid var(--border);color:var(--muted)}
.gx-steps span.ok{color:var(--green);border-color:rgba(0,255,176,.35)}
.gx-steps span.ok::before{content:'\2713  '}
.gx-steps span.now{color:#fff;border-color:var(--accent);background:rgba(123,92,255,.18)}
.gx-deal .gx-tag.pending{animation:xcPulse 1.6s ease-in-out infinite}
.gx-deal-ico{margin-top:2px}
.gx-deal-ico .sym{width:26px;height:26px;font-size:11px}
.gx-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin:6px 0 16px;border-radius:14px;
  background:var(--surface);border:1px solid var(--border)}
.gx-tab{font-family:inherit;font-size:13px;font-weight:700;color:var(--muted);background:transparent;border:0;
  border-radius:10px;padding:10px 0;cursor:pointer;letter-spacing:.04em}
.gx-tab.on{color:#fff;background:linear-gradient(135deg,rgba(51,166,245,.35),rgba(123,92,255,.35))}
#gx-pane-buy[hidden],#gx-pane-sell[hidden],.gx-buybox[hidden],#gx-buys-head[hidden]{display:none}
.gx-tc{margin-bottom:14px}
.gx-buybox{background:var(--surface);border:1px solid rgba(51,166,245,.5);border-radius:var(--r-card);padding:14px;margin-bottom:16px}
.gx-bb-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.gx-bb-top b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:18px;color:#fff}
.gx-buybox .btn.solid{margin-top:12px;background:linear-gradient(135deg,#1F8FE5,#5B6CFF)}
.gx-offer .gx-buy-btn{background:linear-gradient(135deg,#1F8FE5,#5B6CFF)}
.gx-hero{position:relative;overflow:hidden;border-radius:20px;padding:16px 16px 14px;margin-bottom:16px;
  background:radial-gradient(120% 90% at 100% 0%,rgba(51,166,245,.20),transparent 60%),var(--surface);
  border:1px solid rgba(51,166,245,.55);box-shadow:0 0 30px rgba(51,166,245,.12)}
.gx-hero[hidden]{display:none}
.gx-hero.done{border-color:rgba(0,255,176,.5);background:radial-gradient(120% 90% at 100% 0%,rgba(0,255,176,.16),transparent 60%),var(--surface)}
.gx-hero-top{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.gx-hero-big{display:block;font-family:'Rajdhani','Exo 2',sans-serif;font-size:30px;color:#fff;margin:8px 0 0;line-height:1.1}
.gx-hero.done .gx-hero-big{color:var(--green)}
.gx-hero-sub{margin:0;font-size:13px;color:var(--muted)}
.gx-hero p{font-size:12.5px;color:var(--muted);line-height:1.55;margin:10px 0 0}
.gx-steps.big{gap:8px;margin-top:12px}
.gx-steps.big span{font-size:12px;padding:6px 11px}
.gx-steps span.now{position:relative}
.gx-steps span.now::after{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;margin-left:7px;
  background:#fff;vertical-align:middle;animation:gxBlink 1s ease-in-out infinite}
@keyframes gxBlink{50%{opacity:.15}}
.gx-problem{margin-top:10px;font-size:12.5px;line-height:1.5;color:var(--gold);background:rgba(232,200,64,.08);
  border:1px solid rgba(232,200,64,.3);border-radius:10px;padding:8px 10px}
.gx-problem .gx-link{margin-left:4px}
.gx-hero .gx-refund{margin-top:12px;width:100%}
.gx-hero-links{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;font-size:12px}
.gx-hero-links a{color:var(--accent2)}
.gx-hero-close{margin-top:12px;width:100%;padding:10px 0}
.gx-hero .gx-selfclaim{margin-top:12px;width:100%;background:linear-gradient(135deg,#1F8FE5,#5B6CFF)}
.gx-hint{font-size:11.5px !important;margin-top:6px !important}
#gx-relay-edit[hidden]{display:none}

/* ══ wallet-wide notification card (notify.js) ══ */
.nt-card{position:fixed;inset:0;z-index:70;display:flex;align-items:flex-start;justify-content:center;
  padding:calc(70px + env(safe-area-inset-top,0px)) 16px 0;background:rgba(5,8,16,.5);backdrop-filter:blur(3px)}
.nt-card[hidden]{display:none}
.nt-in{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--border);border-radius:20px;
  padding:18px 18px 16px;box-shadow:0 18px 50px rgba(0,0,0,.5);animation:gxDrop .28s ease-out}
.nt-in.success{border-color:rgba(0,255,176,.45);background:radial-gradient(120% 90% at 100% 0%,rgba(0,255,176,.14),transparent 60%),var(--surface)}
.nt-in.warn{border-color:rgba(232,200,64,.5)}
.nt-in.info{border-color:rgba(123,92,255,.5)}
.nt-top{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.nt-ico{display:flex}
.nt-ico .sym{width:26px;height:26px;font-size:11px}
.nt-in b{display:block;font-family:'Rajdhani','Exo 2',sans-serif;font-size:24px;color:#fff;margin:10px 0 4px}
.nt-in.success b{color:var(--green)}
.nt-in p{font-size:12.5px;color:var(--muted);line-height:1.5;margin:0 0 14px}
.nt-btns{display:flex;gap:10px}
.nt-btns .dust{flex:1;padding:12px 0}
.nt-btns .btn{flex:2;margin:0}
.act{position:relative}
.nt-badge{position:absolute;top:6px;right:10px;min-width:18px;height:18px;border-radius:999px;background:var(--red);color:#fff;
  font-size:10.5px;font-weight:700;display:grid;place-items:center;padding:0 5px}
.nt-badge[hidden]{display:none}

/* ══ GRAM theme for the wallet-wide card: blue frame, a faded mark behind ══ */
.nt-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);
  animation:ntLive 1.6s ease-in-out infinite}
.nt-dot[hidden]{display:none}
@keyframes ntLive{50%{opacity:.35}}
.nt-in.gram{position:relative;overflow:hidden;border-color:rgba(51,166,245,.65);
  background:radial-gradient(120% 90% at 100% 0%,rgba(51,166,245,.20),transparent 60%),var(--surface);
  box-shadow:0 18px 50px rgba(0,0,0,.5),0 0 0 1px rgba(51,166,245,.15),0 0 36px rgba(51,166,245,.18)}
.nt-in.gram::after{content:'';position:absolute;right:-46px;top:-38px;width:210px;height:210px;pointer-events:none;
  background:url('../tokens/GRAM.webp') center/contain no-repeat;opacity:.09;filter:blur(1.5px);transform:rotate(-12deg)}
.nt-in.gram>*{position:relative;z-index:1}
.nt-in.gram .nt-ico .sym{width:28px;height:28px;font-size:12px}
.nt-in.gram .btn.solid{background:linear-gradient(135deg,#1F8FE5,#5B6CFF)}

/* ══ Telegram alerts: a setting with a switch, not a sentence ══ */
.gx-alerts{display:flex;align-items:center;gap:14px;margin:0 0 6px;padding:12px 14px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-row);transition:border-color .2s}
.gx-alerts[hidden]{display:none}
.gx-alerts.on{border-color:rgba(0,212,255,.28)}
.gx-alerts-l{flex:1;min-width:0}
.gx-alerts-l b{display:block;font-size:13.5px;font-weight:600;color:var(--text)}
.gx-alerts-l span{display:block;font-size:11.5px;color:var(--muted);line-height:1.5;margin-top:2px}
.gx-alerts+.gx-msg{margin:4px 4px 18px}
.gx-alerts+.gx-msg:empty{min-height:0;margin:0 0 18px}

.gx-switch{position:relative;flex:none;width:48px;height:28px;border-radius:999px;cursor:pointer;padding:0;
  background:var(--surface2);border:1px solid var(--border);transition:background .2s,border-color .2s}
.gx-switch i{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:var(--muted);
  box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .22s cubic-bezier(.2,.9,.3,1),background .2s}
.gx-switch[aria-checked="true"]{background:linear-gradient(135deg,var(--accent-dark),var(--accent));border-color:transparent}
.gx-switch[aria-checked="true"] i{transform:translateX(20px);background:#fff}
/* busy: the knob turns into a spinner where it stands */
.gx-switch.busy{cursor:progress}
.gx-switch.busy i{background:transparent;box-shadow:none;border:2px solid var(--accent2);border-top-color:transparent;
  animation:sp .7s linear infinite}
.gx-switch.busy[aria-checked="true"] i{animation:gxSpinOn .7s linear infinite}
@keyframes gxSpinOn{from{transform:translateX(20px) rotate(0)}to{transform:translateX(20px) rotate(360deg)}}
.gx-switch:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}

/* ══ the confirm sheet: details scroll, the PIN and the outcome stay in view ══ */
.gx-sheet-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;margin:0 -6px;padding:0 6px 4px;
  transition:opacity .2s}
.gx-sheet-note{font-size:12px;color:var(--muted);line-height:1.55;margin:0 0 10px}
.gx-terms-pts{margin:0 0 12px;padding-left:18px;font-size:13px;line-height:1.55}
.gx-terms-pts li{margin:0 0 8px}
.gx-sheet-note a{color:var(--accent2)}
.gx-terms-line{font-size:12px;color:var(--muted);text-align:center;margin:22px 8px 8px}
.gx-terms-line a{color:var(--accent2)}
.gx-sheet-foot{flex:none;padding-top:12px;margin:0 -16px;padding-left:16px;padding-right:16px;
  box-shadow:0 -14px 18px -16px rgba(0,0,0,.9)}
.gx-sheet-foot .pinbox{margin:0;padding:16px 18px 6px}
.gx-sheet-foot .pinbox[hidden]{display:none}
.gx-sheet-foot .gx-msg:empty{min-height:0;margin:0}
/* while it runs the details are settled: dimmed, still readable */
#gx-sheet[data-mode="run"] .gx-sheet-body{opacity:.5;pointer-events:none}
/* at the end the outcome is the whole story */
#gx-sheet[data-mode="done"] .gx-sheet-body,#gx-sheet[data-mode="fail"] .gx-sheet-body{display:none}
#gx-sheet[data-mode="done"] .gx-sheet-foot,#gx-sheet[data-mode="fail"] .gx-sheet-foot{box-shadow:none;padding-top:4px}
#gx-sheet[data-mode="done"] .gx-prog{display:none}

/* the steps of an action, ticked as they complete */
.gx-prog{list-style:none;margin:2px 0 4px;padding:0}
.gx-prog[hidden]{display:none}
.gx-prog li{position:relative;display:flex;align-items:center;gap:12px;padding:7px 2px;font-size:13.5px;color:var(--muted)}
.gx-prog li i{position:relative;flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--border);background:var(--bg)}
.gx-prog li:not(:last-child)::before{content:'';position:absolute;left:11.25px;top:28px;height:calc(100% - 20px);width:1.5px;
  background:var(--border)}
.gx-prog li.ok::before{background:rgba(0,255,176,.4)}
.gx-prog li.ok{color:var(--text)}
.gx-prog li.ok i{border-color:var(--green);background:rgba(0,255,176,.14)}
.gx-prog li.ok i::after{content:'';position:absolute;left:5.5px;top:2.5px;width:5px;height:9px;
  border:solid var(--green);border-width:0 2px 2px 0;transform:rotate(45deg)}
.gx-prog li.now{color:#fff;font-weight:600}
.gx-prog li.now i{border:2px solid var(--accent2);border-top-color:transparent;animation:sp .7s linear infinite}
.gx-prog li.bad{color:var(--red);font-weight:600}
.gx-prog li.bad i{border-color:var(--red);background:rgba(255,107,107,.16)}
.gx-prog li.bad i::before,.gx-prog li.bad i::after{content:'';position:absolute;left:8px;top:3.5px;width:1.8px;height:10px;
  background:var(--red);transform:rotate(45deg)}
.gx-prog li.bad i::after{transform:rotate(-45deg)}

/* the outcome: what happened, and what happens next */
.gx-done{text-align:center;padding:8px 2px 2px}
.gx-done[hidden]{display:none}
.gx-done-mark{position:relative;display:block;width:56px;height:56px;margin:4px auto 0;border-radius:50%;
  border:1.5px solid var(--green);background:radial-gradient(circle,rgba(0,255,176,.22),rgba(0,255,176,.06) 70%);
  box-shadow:0 0 30px rgba(0,255,176,.25);animation:gxMark .4s cubic-bezier(.2,1.4,.4,1) both}
.gx-done-mark::after{content:'';position:absolute;left:20px;top:13px;width:11px;height:20px;
  border:solid var(--green);border-width:0 3px 3px 0;transform:rotate(45deg)}
@keyframes gxMark{from{transform:scale(.55);opacity:0}}
.gx-done b{display:block;font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:25px;color:#fff;line-height:1.15;margin:12px 0 6px}
.gx-done p{font-size:13px;color:var(--muted);line-height:1.6;max-width:36ch;margin:0 auto 16px}
.gx-done-btns{display:flex;flex-direction:column;gap:8px}
.gx-done-btns .btn{margin:0}
.gx-done.bad .gx-done-mark{border-color:var(--red);background:radial-gradient(circle,rgba(255,107,107,.22),rgba(255,107,107,.06) 70%);
  box-shadow:0 0 30px rgba(255,107,107,.2)}
.gx-done.bad .gx-done-mark::before,.gx-done.bad .gx-done-mark::after{content:'';position:absolute;left:26.5px;top:15px;width:3px;height:24px;
  border:0;background:var(--red);transform:rotate(45deg)}
.gx-done.bad .gx-done-mark::after{transform:rotate(-45deg)}
.gx-done.bad p{color:var(--text);word-break:break-word}

/* a deal opened from an alert: marked for a moment so the eye lands on it */
.gx-deal.flash{animation:gxFlash 1.8s ease-out 1}
@keyframes gxFlash{0%,35%{border-color:var(--accent2);box-shadow:0 0 0 3px rgba(0,212,255,.22)}}

@media (prefers-reduced-motion:reduce){
  .gx-switch i,.gx-done-mark,.gx-deal.flash,.nt-dot{transition:none;animation:none}
  .gx-prog li.now i,.gx-switch.busy i{animation-duration:1.6s}
}

/* ---------- transfers on their way (tx.js) ---------- */
.txq{display:flex;flex-direction:column;gap:8px;margin:4px 0 16px}
.txq[hidden]{display:none}
.txq-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font-family:inherit;color:var(--text);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-row);padding:11px 14px;cursor:pointer;
  animation:txq-in .25s ease-out}
.txq-row:active{transform:scale(.985)}
.txq-ico{display:flex;flex:none}
.txq-ico .sym{width:32px;height:32px;font-size:13px}
.txq-mid{display:flex;flex-direction:column;min-width:0;flex:1}
.txq-mid b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:15.5px;color:#fff;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.txq-mid span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.txq-st{width:20px;height:20px;flex:none;border-radius:50%;position:relative}
.txq-row.wait,.txq-row.slow{border-color:rgba(123,92,255,.45)}
.txq-row.wait .txq-st,.txq-row.slow .txq-st{border:2px solid rgba(123,92,255,.25);border-top-color:var(--accent);animation:txq-spin .8s linear infinite}
.txq-row.done{border-color:rgba(0,255,176,.4)}
.txq-row.done .txq-st{background:rgba(0,255,176,.15)}
.txq-row.done .txq-st::after{content:"";position:absolute;left:7px;top:4px;width:5px;height:9px;border:solid var(--green);border-width:0 2px 2px 0;transform:rotate(45deg)}
.txq-row.done .txq-mid span{color:var(--green)}
.txq-row.fail{border-color:rgba(255,107,107,.45)}
.txq-row.fail .txq-st{background:rgba(255,107,107,.15)}
.txq-row.fail .txq-st::before,.txq-row.fail .txq-st::after{content:"";position:absolute;left:9px;top:4px;width:2px;height:12px;background:var(--red);border-radius:1px}
.txq-row.fail .txq-st::before{transform:rotate(45deg)}
.txq-row.fail .txq-st::after{transform:rotate(-45deg)}
.txq-row.fail .txq-mid span{color:var(--red);white-space:normal}
@keyframes txq-spin{to{transform:rotate(360deg)}}
@keyframes txq-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---------- quiet refresh ----------
   A number that changed gets one soft pulse; nothing else on screen moves. */
.bump{animation:bump .9s ease-out}
@keyframes bump{0%{color:var(--accent2)}100%{color:inherit}}
.bal-value{font-variant-numeric:tabular-nums}
.row-fiat,.row-amt,.core-usd,.core-qty{font-variant-numeric:tabular-nums}

/* ---------- one token (token.js) ---------- */
li.row[data-k],.core-cell{cursor:pointer;-webkit-tap-highlight-color:transparent}
li.row[data-k]:active,.core-cell:active{opacity:.75}
.tk-head{display:flex;align-items:center;gap:14px;margin:0 2px 18px}
.tk-ico .sym{width:48px;height:48px;font-size:18px}
.tk-id{flex:1;min-width:0}
.tk-id h1{margin:0;font-size:26px;line-height:1.1}
.tk-id span{display:block;font-size:12px;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-px{text-align:right;flex:none}
.tk-px b{display:block;font-family:'Rajdhani','Exo 2',sans-serif;font-size:19px;color:#fff;font-variant-numeric:tabular-nums}
.tk-px span{font-size:11.5px;color:var(--muted)}
.tk-balcard{background:linear-gradient(135deg,rgba(123,92,255,.16),rgba(0,212,255,.06));border:1px solid var(--border);
  border-radius:var(--r-card);padding:18px 18px 16px;margin-bottom:18px}
.tk-label{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600}
.tk-balcard>b{display:block;font-family:'Rajdhani','Exo 2',sans-serif;font-size:30px;color:#fff;margin:6px 0 4px;
  font-variant-numeric:tabular-nums;word-break:break-word}
.tk-balrow{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}
.tk-balrow span:first-child{color:var(--text);font-weight:600}
.act:disabled{opacity:.35;pointer-events:none}
.act[hidden]{display:none}
.tk-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);padding:6px 16px;margin-bottom:22px}
.tk-line{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--border);font-size:13px}
.tk-line:last-child{border-bottom:none}
.tk-line span{color:var(--muted)}
.tk-line b{color:var(--text);font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.tk-pools{padding:4px 0 6px}
.tk-pool{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:12.5px}
.tk-pool span{display:flex;flex-direction:column}
.tk-pool b{color:var(--text);font-weight:600}
.tk-pool i{font-style:normal;color:var(--muted);font-size:11px}
.tk-pool em{font-style:normal;color:var(--text);font-variant-numeric:tabular-nums}
.tk-more,.tk-note{font-size:11.5px;color:var(--muted);padding:4px 0 10px;line-height:1.5;margin:0}
.tk-none{font-size:12.5px;color:var(--muted);padding:14px 0;line-height:1.5}
.tk-sum{display:flex;align-items:baseline;gap:8px;padding:12px 0;border-bottom:1px solid var(--border)}
.tk-sum span{flex:1;font-size:12px;color:var(--muted)}
.tk-sum b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:17px;color:#fff;font-variant-numeric:tabular-nums}
.tk-sum i{font-style:normal;font-size:12px;color:var(--muted)}
.tk-pos{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}
.tk-pos.tap,.tk-pos[data-addr]{cursor:pointer}
.tk-pos-i{--tint:#7B8AA5;width:36px;height:36px;border-radius:12px;flex:none;display:grid;place-items:center;
  background:color-mix(in srgb,var(--tint) 14%,transparent)}
.tk-pos-i svg{width:18px;height:18px;stroke:var(--tint);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tk-pos-i.wallet{--tint:#00D4FF}.tk-pos-i.stake{--tint:#7B5CFF}.tk-pos-i.pool{--tint:#00FFB0}
.tk-pos-i.farm{--tint:#E8C840}.tk-pos-i.gift{--tint:#E8C840}.tk-pos-i.wait{--tint:#FF6B8A}
.tk-pos-m{flex:1;min-width:0;display:flex;flex-direction:column}
.tk-pos-m b{font-size:13.5px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-pos-m span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-pos-r{text-align:right;display:flex;flex-direction:column;flex:none;max-width:48%}
.tk-pos-r b{font-size:13px;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-pos-r span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-looking{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--muted);padding:12px 0}
.tk-looking i{width:12px;height:12px;border-radius:50%;border:2px solid rgba(123,92,255,.25);border-top-color:var(--accent);
  animation:txq-spin .8s linear infinite}
.tk-addr{display:flex;align-items:center;gap:10px;width:100%;background:none;border:none;border-bottom:1px solid var(--border);
  padding:11px 0;font-family:inherit;font-size:13px;color:var(--text);cursor:pointer;text-align:left}
.tk-addr span{color:var(--muted);flex:1}
.tk-addr b{font-weight:600}
.tk-addr i{font-style:normal;font-size:11px;color:var(--accent2)}
.tk-link{display:block;width:100%;background:none;border:none;border-bottom:1px solid var(--border);padding:11px 0;
  font-family:inherit;font-size:13px;color:var(--accent2);text-align:left;cursor:pointer}
.tk-link:last-child{border-bottom:none}
.tk-desc{font-size:12.5px;color:var(--muted);line-height:1.55;margin:10px 0}
.tk-acts-list{padding:4px 12px}
.tk-skel{height:14px;border-radius:7px;margin:14px 0;background:linear-gradient(90deg,var(--surface2),var(--border),var(--surface2));
  background-size:200% 100%;animation:tk-sh 1.2s linear infinite}
.tk-skel:nth-child(2n){width:70%}
@keyframes tk-sh{to{background-position:-200% 0}}
/* pickers: a section heading between what you hold and everything else */
.sw-sec{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:14px 6px 6px}

/* token page console: swap marked like the home one */
#tk-swap{color:#E8F0FF}
#tk-swap svg{stroke:#00D4FF}

/* ---------- DeFi positions (defi.js) ---------- */
.earn-entry{display:flex;align-items:center;gap:12px;width:100%;margin:12px 0 4px;padding:13px 14px;cursor:pointer;
  background:linear-gradient(135deg,rgba(0,255,176,.08),rgba(123,92,255,.10));border:1px solid var(--border);
  border-radius:var(--r-card);font-family:inherit;color:var(--text);text-align:left}
.earn-entry:active{transform:scale(.985)}
.earn-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;flex:none;background:rgba(0,255,176,.12)}
.earn-ic svg{width:18px;height:18px;stroke:#00FFB0;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.earn-mid{flex:1;min-width:0;display:flex;flex-direction:column}
.earn-mid b{font-size:13.5px;color:#fff}
.earn-mid span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.earn-r{font-family:'Rajdhani','Exo 2',sans-serif;font-size:16px;color:#fff;font-variant-numeric:tabular-nums}
.earn-chev{width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;flex:none}
.ea-h{margin:0;font-size:20px}
.ea-bar{display:flex;align-items:center;gap:10px;margin:-6px 2px 8px}
.ea-status{flex:1;font-size:11.5px;color:var(--muted)}
.ea-status[hidden]{display:block;visibility:hidden}
.ea-rescan{background:none;border:1px solid var(--border);border-radius:999px;color:var(--accent2);font-family:inherit;
  font-size:11px;padding:5px 12px;cursor:pointer}
.ea-sum{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.ea-card{padding:2px 14px}
.ea-pos{padding:13px 0;border-bottom:1px solid var(--border);cursor:pointer}
.ea-pos:last-child{border-bottom:none}
.ea-top{display:flex;align-items:center;gap:12px}
.ea-mid{flex:1;min-width:0;display:flex;flex-direction:column}
.ea-mid b{font-size:13.5px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ea-mid span{font-size:11px;color:var(--muted)}
.ea-share{margin-left:8px;color:var(--accent2)}
.ea-usd{font-family:'Rajdhani','Exo 2',sans-serif;font-size:16px;color:#fff;font-variant-numeric:tabular-nums;flex:none}
.ea-holds{display:flex;flex-wrap:wrap;gap:6px 14px;margin:9px 0 0 48px}
.ea-amt{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.ea-amt b{color:var(--text);font-variant-numeric:tabular-nums}
.ea-amt .sym{width:18px;height:18px;font-size:8px}
.ea-rew{margin:7px 0 0 48px;font-size:12px;color:var(--muted)}
.ea-rew b{color:var(--green);font-weight:600}
.ea-note{margin:6px 0 0 48px;font-size:11.5px;color:var(--muted);line-height:1.5}

/* positions: token logos, detail page */
.ea-logos{position:relative;display:inline-flex;flex:none;width:36px;height:36px}
.ea-logos .sym{width:30px;height:30px;font-size:11px;border:2px solid var(--surface);border-radius:50%}
.ea-logos.two .sym:first-child{position:absolute;left:0;top:0;z-index:2}
.ea-logos.two .sym:last-child{position:absolute;right:-2px;bottom:-2px;width:24px;height:24px}
.ea-logos:not(.two) .sym{width:36px;height:36px}
.ea-logos.big{width:52px;height:52px}
.ea-logos.big .sym{width:44px;height:44px;font-size:15px}
.ea-logos.big.two .sym:last-child{width:32px;height:32px}
.ea-logos.big:not(.two) .sym{width:52px;height:52px}
.ea-chev{width:14px;height:14px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;flex:none}
.ea-plus{font-style:normal;color:var(--muted);font-size:12px}
.ea-holds{align-items:center}
.ea-tag{margin-left:8px;color:var(--green);font-weight:600}
.ep-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--border)}
.ep-row:last-child{border-bottom:none}
.ep-row .sym{width:28px;height:28px;font-size:10px}
.ep-sym{flex:1;font-size:13.5px;color:var(--text);font-weight:600}
.ep-amt{display:flex;flex-direction:column;text-align:right}
.ep-amt b{font-size:13.5px;color:#fff;font-variant-numeric:tabular-nums}
.ep-amt i{font-style:normal;font-size:11.5px;color:var(--muted)}
.ep-row.gain .ep-amt b{color:var(--green)}
#ep-rew-wrap[hidden],#ep-stats-wrap[hidden]{display:none}
.ep-actions{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 6px}
.ep-act{flex:1 1 30%;min-width:96px;padding:12px 10px;border-radius:14px;border:1px solid var(--border);
  background:var(--surface);color:var(--text);font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.ep-act:disabled{opacity:.45;cursor:default}
.ep-finder{text-align:center;border-bottom:none;margin-top:6px}

/* position actions */
.ep-btns{display:flex;flex-wrap:wrap;gap:8px}
.ep-act:not(:disabled){border-color:rgba(123,92,255,.45)}
.ep-act.on{background:rgba(123,92,255,.18);border-color:var(--accent)}
.ep-panel{margin-top:10px}
.ep-panel:empty{display:none}
.ep-picks{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:8px}
.ep-pick{padding:9px 0;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);
  font-family:inherit;font-size:12px;cursor:pointer}
.ep-pick.on{border-color:var(--accent2);color:var(--accent2)}
.ep-what{font-size:12.5px;color:var(--text);margin:4px 2px 10px}
.ep-panel .btn{width:100%;margin-top:10px}
.ea-stale{margin-left:8px;color:var(--muted);font-style:italic}

/* ---------- DeFi positions card on home: a living card, not a list row ---------- */
.earn-entry{position:relative;overflow:hidden;isolation:isolate;padding:15px 14px;
  background:radial-gradient(120% 140% at 0% 0%,rgba(0,255,176,.16),transparent 55%),
             radial-gradient(120% 140% at 100% 100%,rgba(123,92,255,.22),transparent 60%),var(--surface);
  border:1px solid rgba(0,255,176,.22)}
/* a slow light that runs along the border */
.earn-entry::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;z-index:-1;
  background:conic-gradient(from var(--earn-a,0deg),transparent 0 70%,rgba(0,255,176,.9) 80%,rgba(123,92,255,.9) 88%,transparent 96%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:earn-spin 6s linear infinite}
@property --earn-a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes earn-spin{to{--earn-a:360deg}}
@media (prefers-reduced-motion:reduce){.earn-entry::before{animation:none}}
.earn-stack{display:flex;align-items:center;flex:none;min-width:40px}
.earn-stack.logos .earn-ic{display:none}
.earn-stack .sym{width:30px;height:30px;font-size:11px;border-radius:50%;border:2px solid var(--surface);
  box-shadow:0 2px 8px rgba(0,0,0,.35)}
.earn-stack .sym+.sym{margin-left:-11px}
.earn-stack .sym:nth-child(1){z-index:3}.earn-stack .sym:nth-child(2){z-index:2}.earn-stack .sym:nth-child(3){z-index:1}
.earn-more{margin-left:-8px;z-index:0;height:22px;min-width:22px;padding:0 6px;border-radius:11px;display:grid;place-items:center;
  font-size:10px;font-weight:700;color:#00FFB0;background:rgba(0,255,176,.12);border:1px solid rgba(0,255,176,.3)}
.earn-ic{width:38px;height:38px;border-radius:13px;background:linear-gradient(135deg,#00FFB0,#7B5CFF);
  box-shadow:0 4px 16px rgba(0,255,176,.25)}
.earn-ic svg{stroke:#0B0F1A;stroke-width:2.2}
.earn-r{display:flex;flex-direction:column;align-items:flex-end;flex:none}
.earn-r b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:17px;color:#fff;font-variant-numeric:tabular-nums;font-weight:700}
.earn-r i{font-style:normal;font-size:10.5px;color:var(--green);font-weight:600}
.earn-r i:empty,.earn-r b:empty{display:none}

/* ---------- banner pictures in the carousel (ads.js) ----------
   1200 x 464 pictures (2.59 : 1): the slide takes their shape, so nothing is
   cropped on any phone width. The progress ticks sit on a soft shade at the
   bottom so they read over a bright picture. */
.ad.ad-img{padding:0;min-height:0;aspect-ratio:1200/464;display:block;background:#0B0F1A}
.ad.ad-img img{display:block;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}
.ad.ad-img::after{content:"";position:absolute;inset:auto 0 0 0;height:34%;pointer-events:none;
  background:linear-gradient(0deg,rgba(11,15,26,.75),transparent)}
/* a slow sheen crossing the banner, once per slide */
.ad-shine{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.ad-shine::before{content:"";position:absolute;top:-20%;bottom:-20%;width:30%;left:-40%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.10),transparent);transform:skewX(-18deg);
  animation:ad-sheen 6s ease-in-out infinite}
@keyframes ad-sheen{0%,55%{left:-40%}85%,100%{left:120%}}
@media (prefers-reduced-motion:reduce){.ad-shine::before{animation:none;display:none}}
.ads:has(.ad-img){border-color:rgba(123,92,255,.35);box-shadow:0 8px 28px rgba(0,0,0,.35)}
.ads-ticks .t{background:rgba(232,240,255,.25)}

/* ---------- banners, settled into the page ----------
   Same width and corners as every other card (no more 10 px past the column
   on each side), a slimmer 3.4 : 1 picture, and placed below the money: the
   home screen reads balance, actions, assets, DeFi, then partners. */
.ads{margin:12px 0 18px;border-radius:var(--r-card);border-color:var(--border);box-shadow:none}
.ads:has(.ad-img){border-color:var(--border);box-shadow:none}
.ad.ad-img{aspect-ratio:1200/353}
.ad.ad-img::after{height:28%;background:linear-gradient(0deg,rgba(11,15,26,.55),transparent)}
.ads-ticks{bottom:8px;left:12px}
.ads-ticks .t{width:12px}

/* token page positions: the token's own logo with a kind badge */
.tk-face{position:relative;width:36px;height:36px;flex:none}
.tk-face .sym{width:36px;height:36px;font-size:12px}
.tk-badge{--tint:#7B8AA5;position:absolute;right:-4px;bottom:-4px;width:18px;height:18px;border-radius:50%;
  display:grid;place-items:center;background:var(--tint);border:2px solid var(--surface)}
.tk-badge svg{width:10px;height:10px;stroke:#0B0F1A;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.tk-badge.wallet{--tint:#00D4FF}.tk-badge.stake{--tint:#7B5CFF}.tk-badge.gift{--tint:#E8C840}.tk-badge.wait{--tint:#FF6B8A}
.tk-badge.stake svg{stroke:#fff}
.tk-pos .ea-logos{width:36px;height:36px}
/* total = wallet + DeFi, split under the number */
.bal-split{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:8px;font-size:12px;color:var(--muted)}
.bal-split[hidden]{display:none}
.bal-split b{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
.bal-split i{width:3px;height:3px;border-radius:50%;background:var(--muted)}

/* ---------- Activity: logos, places, amounts, filters ---------- */
.ac-chips{display:flex;gap:6px;flex-wrap:wrap;margin:0 2px 8px}
.ac-chip{font-family:inherit;font-size:11.5px;padding:6px 12px;border-radius:999px;cursor:pointer;
  border:1px solid var(--border);background:transparent;color:var(--muted)}
.ac-chip.on{border-color:var(--accent2);color:var(--accent2);background:rgba(0,212,255,.08)}
.ac-day{display:flex;justify-content:space-between;align-items:baseline}
.ac-day em{font-style:normal;font-family:inherit;letter-spacing:0;text-transform:none;font-size:11px;color:var(--muted)}
.ac-face{position:relative;width:40px;height:40px;flex:none;display:block}
.ac-face>.sym,.ac-face>.ac-plain{width:40px;height:40px;font-size:13px;border-radius:50%}
.ac-plain{display:grid;place-items:center;background:#131A2B;border:1px solid var(--border)}
.ac-plain svg{width:18px;height:18px;stroke:#7B8AA5;fill:none;stroke-width:1.6}
.ac-badge{--tint:#7B8AA5;position:absolute;right:-3px;bottom:-3px;width:19px;height:19px;border-radius:50%;
  display:grid;place-items:center;background:var(--tint);border:2px solid var(--bg)}
.ac-badge svg{width:10px;height:10px;stroke:#0B0F1A;fill:none;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.ac-badge.in{--tint:#00FFB0}.ac-badge.out{--tint:#FF6B8A}.ac-badge.gift{--tint:#E8C840}
.ac-badge.stake{--tint:#7B5CFF}.ac-badge.stake svg{stroke:#fff}.ac-badge.cancel{--tint:#8FA3C8}
.ac-badge.wait{--tint:#E8C840}.ac-badge.fail{--tint:var(--red)}.ac-badge.fail svg{stroke:#fff}
.ac-face.pair>.sym:first-child{position:absolute;left:0;top:0;width:30px;height:30px;font-size:10px;z-index:1}
.ac-face.pair>.sym:last-child{position:absolute;right:0;bottom:0;width:26px;height:26px;font-size:9px;
  border:2px solid var(--bg);border-radius:50%;z-index:2}
.ac-row.pending{cursor:default;opacity:.9}
.ac-w.pend{color:#E8C840}
.ac-more{display:block;width:100%;margin:14px 0 4px;padding:11px;border-radius:12px;font-family:inherit;font-size:12.5px;
  border:1px solid var(--border);background:var(--surface);color:var(--accent2);cursor:pointer}
.tx-head .ac-face{margin-right:4px}
.tx-flows{margin:6px 0 10px;border:1px solid var(--border);border-radius:12px;padding:2px 12px}
.tx-flow{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}
.tx-flow:last-child{border-bottom:none}
.tx-flow .sym{width:26px;height:26px;font-size:9px}
.tx-flow span{flex:1;font-size:12.5px;color:var(--muted)}
.tx-flow b{display:flex;flex-direction:column;align-items:flex-end;font-size:13.5px;font-variant-numeric:tabular-nums}
.tx-flow b i{font-style:normal;font-weight:400;font-size:11px;color:var(--muted)}
.tx-flow.in b{color:var(--green)}

/* ---------- token list header: title, count, three quiet icon tools ---------- */
.tl-head{display:flex;align-items:center;justify-content:space-between;margin:4px 2px 10px}
.tl-head h2{display:flex;align-items:center;gap:8px;margin:0}
.tl-n{font-family:'Rajdhani','Exo 2',sans-serif;font-size:12px;font-weight:700;color:var(--muted);
  background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:1px 8px}
.tl-n:empty{display:none}
.tl-tools{display:flex;gap:6px}
.ic-btn{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;cursor:pointer;
  background:var(--surface);border:1px solid var(--border);color:var(--muted);transition:border-color .15s,color .15s}
.ic-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ic-btn:active{transform:scale(.94)}
.ic-btn.on{color:var(--accent2);border-color:rgba(0,212,255,.5);background:rgba(0,212,255,.08)}
.ic-btn .ic-slash{display:none}
#dust-toggle.on .ic-slash{display:inline}
.tl-search{margin:-2px 0 10px}
.tl-search[hidden]{display:none}
.tl-search input{width:100%;box-sizing:border-box;padding:11px 14px;border-radius:12px;border:1px solid var(--border);
  background:var(--surface);color:var(--text);font-family:inherit;font-size:13.5px;outline:none}
.tl-search input:focus{border-color:var(--accent2)}
.tl-or{display:flex;align-items:center;gap:10px;margin:14px 0 10px;color:var(--muted);font-size:11px}
.tl-or::before,.tl-or::after{content:"";flex:1;height:1px;background:var(--border)}
/* ---------- refresh: button on the balance card, pull on a phone ---------- */
.bal-refresh{position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;
  background:transparent;border:1px solid var(--border);color:var(--muted);cursor:pointer;z-index:2}
.bal-refresh svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bal-refresh:hover{color:var(--text)}
.bal-refresh.spin svg{animation:rf-spin .8s linear infinite}
@keyframes rf-spin{to{transform:rotate(360deg)}}
.ptr{height:0;overflow:hidden;display:flex;align-items:center;justify-content:center;transition:height .18s ease}
.ptr-ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1px solid var(--border)}
.ptr-ic svg{width:17px;height:17px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;transform:rotate(var(--turn,0deg))}
.ptr.ready .ptr-ic svg{stroke:var(--accent2)}
.ptr.busy .ptr-ic svg{stroke:var(--accent2);animation:rf-spin .8s linear infinite}
/* ---------- NFTs: by collection, four then all, a detail sheet ---------- */
.nft-grid{display:block}
.nft-empty{text-align:center;color:var(--muted);font-size:13px;padding:36px 16px}
.nft-col-sec{margin-bottom:18px}
.nft-col-head{display:flex;align-items:center;gap:8px;margin:0 2px 9px}
.nft-col-head b{font-size:14px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nft-col-head span{font-family:'Rajdhani','Exo 2',sans-serif;font-size:12px;font-weight:700;color:var(--muted);
  border:1px solid var(--border);border-radius:999px;padding:0 7px}
.nft-more{margin-left:auto;background:none;border:none;color:var(--accent2);font-family:inherit;font-size:12px;cursor:pointer;flex:none}
.nft-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
button.nft-card{padding:0;text-align:left;font-family:inherit;color:inherit;cursor:pointer}
.nft-card .nft-art .ph{width:38%;aspect-ratio:1;border-radius:50%;background:#1B2338}
.nft-art.ok{background:#0B0F1A}
.nft-card.sk .nft-art,.nft-line{background:linear-gradient(90deg,var(--surface2),var(--border),var(--surface2));
  background-size:200% 100%;animation:tk-sh 1.2s linear infinite}
.nft-line{height:10px;border-radius:5px;width:60%}
.nft-big{aspect-ratio:1;border-radius:16px;overflow:hidden;background:#12182A;display:grid;place-items:center;margin-bottom:12px}
.nft-big img{width:100%;height:100%;object-fit:contain}
.nft-big .ph{width:30%;aspect-ratio:1;border-radius:50%;background:#1B2338}
.nft-title{margin:0 0 2px;font-size:18px}
.nft-sub{font-size:12px;color:var(--muted);margin-bottom:10px}
.nft-desc{font-size:12.5px;color:var(--muted);line-height:1.55;margin:0 0 12px}
.nft-traits{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.nft-traits div{border:1px solid var(--border);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.nft-traits span{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.nft-traits b{font-size:13px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- one NFT: a viewer over the page, the picture first ---------- */
.nft-view{position:fixed;inset:0;z-index:60;background:rgba(6,9,16,.86);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow-y:auto;overscroll-behavior:contain;
  animation:fade .18s ease}
.nft-view[hidden]{display:none}
.nft-view-in{max-width:460px;margin:0 auto;padding:calc(env(safe-area-inset-top,0px) + 58px) 18px calc(env(safe-area-inset-bottom,0px) + 28px)}
.nft-close{position:fixed;top:calc(env(safe-area-inset-top,0px) + 12px);right:14px;z-index:61;width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;background:rgba(18,24,42,.9);border:1px solid var(--border);cursor:pointer}
.nft-close svg{width:16px;height:16px;stroke:#E8F0FF;fill:none;stroke-width:2.2;stroke-linecap:round}
.nft-view .nft-big{aspect-ratio:auto;max-height:62vh;border-radius:20px;background:#0E1322;
  box-shadow:0 20px 60px -20px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.05);margin-bottom:16px}
.nft-view .nft-big img{width:100%;height:auto;max-height:62vh;object-fit:contain;display:block}
.nft-view .nft-big.sk,.nft-view .nft-big:has(.ph){aspect-ratio:1}
.nft-info{padding:0 2px}
.nft-chip{display:inline-block;font-size:11px;color:var(--accent2);border:1px solid rgba(0,212,255,.35);
  background:rgba(0,212,255,.08);border-radius:999px;padding:3px 10px;margin-bottom:8px}
.nft-view .nft-title{font-size:22px;margin:0 0 4px}
.nft-view .nft-sub{font-size:12px;color:var(--muted);margin-bottom:12px}
.nft-view .nft-desc{font-size:13px;line-height:1.6;color:#A9BBDD;margin:0 0 14px}
.nft-traits-h{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:4px 0 8px}
.nft-link{margin-top:6px}
body.nft-lock{overflow:hidden}

/* ---------- wallets: switcher, read-only watch mode ---------- */
button.wname{display:inline-flex;align-items:center;gap:4px;background:none;border:none;padding:0;cursor:pointer;
  font-family:inherit;color:var(--text);font-weight:600;font-size:15px;line-height:1.2}
button.wname svg{width:15px;height:15px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round}
.wl-ro{display:none;font-style:normal;font-size:10px;font-weight:600;letter-spacing:.06em;color:#E8C840;
  border:1px solid rgba(232,200,64,.4);background:rgba(232,200,64,.1);border-radius:999px;padding:1px 7px;margin-left:4px}
.is-watch .wl-ro{display:inline-block}
.wl-list{display:flex;flex-direction:column;gap:6px;margin:4px 0 14px;max-height:52vh;overflow-y:auto}
.wl-row{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;padding:11px 10px;
  border:1px solid var(--border);border-radius:14px;background:var(--surface);cursor:pointer}
.wl-row.on{border-color:rgba(0,212,255,.45);background:rgba(0,212,255,.06)}
.wl-ava{width:34px;height:34px;border-radius:50%}
.wl-mid{min-width:0;display:flex;flex-direction:column}
.wl-mid b{font-size:14px;color:var(--text);display:flex;align-items:center;gap:6px}
.wl-mid span{font-size:11.5px;color:var(--muted);font-family:ui-monospace,monospace}
.wl-tag{font-style:normal;font-size:9.5px;font-weight:600;color:#E8C840;border:1px solid rgba(232,200,64,.4);border-radius:999px;padding:0 6px}
.wl-r{display:flex;align-items:center;gap:8px}
.wl-r b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:15px;color:#fff;font-variant-numeric:tabular-nums}
.wl-check{width:18px;height:18px;stroke:var(--accent2);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.wl-more{width:30px;height:30px;border-radius:9px;border:none;background:transparent;display:grid;place-items:center;cursor:pointer}
.wl-more svg{width:16px;height:16px;fill:var(--muted)}
.wl-acts{grid-column:1/-1;display:flex;gap:8px}
.wl-acts[hidden]{display:none}
.wl-acts button{flex:1;padding:9px;border-radius:10px;border:1px solid var(--border);background:transparent;color:var(--text);
  font-family:inherit;font-size:12.5px;cursor:pointer}
.wl-acts .danger{color:var(--red);border-color:rgba(255,107,107,.35)}
.wl-add{display:flex;flex-direction:column;gap:8px}
/* read only: nothing that signs is offered */
.is-watch #act-send,.is-watch #act-swap,.is-watch #act-p2p,.is-watch #tk-send,.is-watch #tk-swap{opacity:.35;pointer-events:none}
.is-watch .ep-actions,.is-watch #btn-lock{display:none}

/* ---------- recovery phrase ---------- */
.sd-pin{width:100%;box-sizing:border-box;padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:var(--surface);
  color:var(--text);font-size:20px;letter-spacing:.4em;text-align:center;font-family:inherit;outline:none}
.sd-pin:focus{border-color:var(--accent2)}
.sd-wrap{position:relative;margin:4px 0 12px}
.sd-words{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;transition:filter .25s}
.sd-words span{display:flex;align-items:center;gap:6px;padding:9px 8px;border-radius:10px;border:1px solid var(--border);
  background:var(--surface);font-size:13.5px;color:var(--text);font-family:ui-monospace,monospace}
.sd-words i{font-style:normal;font-size:10px;color:var(--muted);min-width:14px}
.sd-words.blur{filter:blur(7px);user-select:none;pointer-events:none}
.sd-reveal{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:auto;padding:12px 26px}
.sd-reveal[hidden]{display:none}
.is-watch #set-seed{display:none}

/* ---------- refresh, quieter ----------
   replaces the spinning arrow: one turn on press, a light along the card's
   bottom edge while reading, "Updated" for a moment when done */
.bal-refresh{border-color:transparent;background:rgba(255,255,255,.03);opacity:.7;transition:opacity .2s,background .2s}
.bal-refresh:hover{opacity:1;background:rgba(255,255,255,.06)}
.bal-refresh.spin svg{animation:none}
.bal-refresh.turn svg{animation:rf-turn .65s cubic-bezier(.4,.1,.2,1)}
@keyframes rf-turn{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.bal::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;opacity:0;pointer-events:none;
  background:linear-gradient(90deg,transparent,#00D4FF 35%,#7B5CFF 65%,transparent);background-size:45% 100%;
  background-repeat:no-repeat;background-position:-50% 0;transition:opacity .25s}
.bal.loading::after{opacity:1;animation:rf-run 1.1s cubic-bezier(.45,.05,.55,.95) infinite}
@keyframes rf-run{from{background-position:-50% 0}to{background-position:150% 0}}
.bal.done::after{opacity:0;background:linear-gradient(90deg,#00D4FF,#7B5CFF);background-size:100% 100%;
  animation:rf-done .7s ease-out}
@keyframes rf-done{0%{opacity:.9;transform:scaleX(.3)}60%{opacity:.9;transform:scaleX(1)}100%{opacity:0;transform:scaleX(1)}}
.bal-upd{display:inline-block;margin-left:8px;font-size:10px;letter-spacing:.08em;color:var(--green);
  opacity:0;transform:translateY(2px);transition:opacity .3s,transform .3s}
.bal-upd.on{opacity:1;transform:none}
.ptr.busy .ptr-ic svg{animation:none}
@media (prefers-reduced-motion:reduce){.bal.loading::after{animation:none;background-position:50% 0}.bal-refresh.turn svg{animation:none}}

/* ══ settings, tab dock, language (i18n.js) ══
   The dock keeps the home console's language (chamfered frame, cyan beam
   under the selected item). Settings use the same soft cards as the home
   screen, with icons drawn in the brand gradient instead of stock glyphs. */
.tx-flow .sym{flex:none}                       /* the token icon in a transaction stayed round */
.sw-sheet{inset:-12px;padding:12px}            /* the blur reached past the screen edge */

/* token rows: one line each, cut with an ellipsis instead of running into the price column */
.row-name,.row-amt,.row-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row-val{flex:0 1 auto;min-width:0;max-width:58%}

/* Home: the wordmark on top; the balance card lit in its two colours */
.fw-brand{display:flex;align-items:center;justify-content:center;height:46px;margin:-8px 0 10px}
.fw-brand img{display:block;height:58px;width:auto;
  filter:drop-shadow(0 0 10px rgba(123,92,255,.45)) drop-shadow(0 0 22px rgba(0,212,255,.18))}
.tg-fs .fw-brand{position:absolute;left:0;right:0;top:var(--tg-sa,0px);height:var(--tg-csa,46px);margin:0;
  pointer-events:none}
.tg-fs .fw-brand img{height:calc(var(--tg-csa,46px) + 8px)}
.bal{isolation:isolate;border-color:rgba(123,92,255,.3);
  background:radial-gradient(120% 95% at 0% 0%,rgba(123,92,255,.17),transparent 58%),
    radial-gradient(120% 95% at 100% 100%,rgba(0,212,255,.12),transparent 58%),
    linear-gradient(180deg,#151C30,#0F1527);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 -20px 34px rgba(0,0,0,.28),
    0 16px 36px -18px rgba(0,212,255,.35),0 10px 28px -14px rgba(123,92,255,.45)}
.bal::before{background:linear-gradient(90deg,transparent,#7B5CFF 28%,#00D4FF 72%,transparent);opacity:.85}
.bal-value{text-shadow:0 2px 16px rgba(11,15,26,.95),0 0 30px rgba(123,92,255,.3)}
.bal-upd{position:absolute}                   /* "Updated" no longer pushes the label off centre */

.tabs{bottom:calc(10px + env(safe-area-inset-bottom,0px));width:calc(100% - 24px);
  max-width:min(calc(var(--app-w) - 24px),calc(100vw - 24px));padding:1px;gap:1px;
  border-top:none;backdrop-filter:none;-webkit-backdrop-filter:none;
  background:linear-gradient(120deg,rgba(123,92,255,.55),rgba(0,212,255,.35) 55%,rgba(30,42,66,.9));
  clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),
    calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}
.tab{background:rgba(14,19,33,.97);padding:10px 0 9px;gap:5px;font-size:9px;font-weight:600;
  letter-spacing:.05em;text-transform:uppercase;color:#6B82A8;white-space:nowrap;overflow:hidden}
.tab svg{width:21px;height:21px}
.tab.sel{color:#E8F0FF}
.tab.sel svg{stroke:#00D4FF}
.tab.sel::before{content:'';position:absolute;left:14%;right:14%;bottom:0;height:2px;
  background:linear-gradient(90deg,transparent,#00D4FF,transparent)}
.tab.sel::after{content:'';position:absolute;left:50%;bottom:-30px;width:60px;height:40px;
  transform:translateX(-50%);border-radius:50%;background:#00D4FF;opacity:.16;filter:blur(14px);pointer-events:none}
.wpad{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}

.st-head{margin:6px 2px 10px}
.st-vault{display:flex;align-items:center;gap:8px;margin:0 2px 22px}
.st-vault svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--green);stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.st-vault:has(.store.weak) svg{stroke:var(--gold)}
.st-vault .store{display:block;margin:0;padding:5px 12px;border-radius:12px;line-height:1.45;letter-spacing:.06em}
.st-cap{margin:0 2px 8px;font-size:12px;font-weight:600;color:var(--muted)}
.st-group{margin-bottom:20px;border:1px solid var(--border);border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,rgba(22,30,48,.92),rgba(18,24,42,.92))}
.st-group.danger{border-color:rgba(255,107,107,.28);background:rgba(255,107,107,.05)}
.st-row{position:relative;display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:11px 16px;
  border:0;background:none;color:var(--text);font:inherit;text-align:left;cursor:pointer;
  -webkit-tap-highlight-color:transparent;transition:background .15s}
.st-row+.st-row::before{content:'';position:absolute;top:0;left:54px;right:0;height:1px;background:var(--border)}
.st-row[hidden]{display:none}
.st-row:active{background:rgba(123,92,255,.08)}
.st-row.st-info{cursor:default}
.st-row.st-info:active{background:none}
.st-ico{width:24px;height:24px;flex:none;fill:none;stroke:url(#fw-g);stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.st-ico .d{fill:url(#fw-g);fill-opacity:.16;stroke:none}
.danger .st-ico{stroke:var(--red)}
.danger .st-ico .d{fill:var(--red);fill-opacity:.14}
.st-txt{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.st-txt b{font-size:14.5px;font-weight:600;line-height:1.3}
.st-txt small{font-size:12px;color:var(--muted);line-height:1.35;margin-top:2px}
.danger .st-txt b{color:var(--red)}
.st-val{display:flex;align-items:center;gap:8px;flex:none;font-size:13.5px;font-weight:600;color:#C9D6F2}
.st-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}
.lg-dot{width:20px;height:20px;border-radius:50%;flex:none;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.st-chev{width:16px;height:16px;flex:none;margin-left:-4px;fill:none;stroke:var(--muted);stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}

.lg-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:4px 0 12px}
.lg-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-height:104px;
  padding:15px 14px 13px;border:1px solid var(--border);border-radius:16px;overflow:hidden;
  background:#12182A;color:var(--muted);font:inherit;text-align:left;cursor:pointer;isolation:isolate;
  -webkit-tap-highlight-color:transparent;transition:border-color .2s}
.lg-tile:active{transform:scale(.98)}
.lg-flag{position:absolute;z-index:-1;top:-14px;right:-26px;width:118px;height:80px;transform:rotate(-12deg);
  opacity:.34;-webkit-mask-image:linear-gradient(105deg,transparent 8%,#000 62%);
  mask-image:linear-gradient(105deg,transparent 8%,#000 62%);transition:opacity .25s}
.lg-tile::before{content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(18,24,42,0) 30%,rgba(18,24,42,.85) 78%)}
.lg-hello{font-family:'Exo 2',sans-serif;font-size:24px;font-weight:700;line-height:1.05;letter-spacing:-.01em;
  color:#E8F0FF;text-shadow:0 1px 10px rgba(0,0,0,.55)}
.lg-name{margin-top:auto;padding-top:12px;font-size:13px;font-weight:600;color:var(--text)}
.lg-en{font-size:11px;color:var(--muted)}
.lg-check{position:absolute;top:11px;right:11px;width:22px;height:22px;padding:4px;border-radius:50%;
  background:#00D4FF;fill:none;stroke:#0B0F1A;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;
  opacity:0;transform:scale(.6);transition:opacity .2s,transform .2s}
.lg-tile[aria-pressed="true"]{border-color:rgba(0,212,255,.7);box-shadow:0 0 0 1px rgba(0,212,255,.25),0 8px 24px rgba(0,212,255,.12)}
.lg-tile[aria-pressed="true"] .lg-flag{opacity:.62}
.lg-tile[aria-pressed="true"] .lg-check{opacity:1;transform:none}
.lg-note{margin:0 8px 6px;font-size:11.5px;line-height:1.5;color:var(--muted);text-align:center}
@media (prefers-reduced-motion:reduce){.lg-check,.lg-flag,.st-row,.lg-tile{transition:none}}

/* ══ governance (gov.js) ══ */
.gv-power{display:flex;align-items:center;gap:12px;margin:0 0 20px;padding:14px 16px;border-radius:18px;
  border:1px solid rgba(123,92,255,.3);
  background:radial-gradient(120% 120% at 0% 0%,rgba(123,92,255,.16),transparent 60%),linear-gradient(180deg,#151C30,#10162A)}
.gv-power.warn{border-color:rgba(232,200,64,.35);background:linear-gradient(180deg,rgba(232,200,64,.07),rgba(18,24,42,.9))}
.gv-power-t{flex:1;min-width:0;display:flex;flex-direction:column}
.gv-power-t span{font-size:11.5px;font-weight:600;color:var(--muted)}
.gv-power-t b{font-family:'Rajdhani','Exo 2',sans-serif;font-size:24px;font-weight:700;color:#fff;line-height:1.15}
.gv-power-t b i{font-style:normal;font-size:13px;color:var(--muted);font-weight:600}
.gv-power-t small{font-size:11.5px;color:#C9D6F2;line-height:1.4;margin-top:2px}
.gv-power-t small.gv-power-of{color:var(--muted);font-size:11px;margin-top:1px}
.gv-power-t b i{margin-left:2px}
.gv-power-go{flex:none;padding:9px 14px;border-radius:12px;border:1px solid rgba(0,212,255,.45);background:rgba(0,212,255,.08);
  color:#00D4FF;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.gv-power.warn .gv-power-go{border-color:rgba(232,200,64,.5);background:rgba(232,200,64,.1);color:var(--gold)}

.gv-card{display:flex;flex-direction:column;align-items:stretch;gap:0;width:100%;margin-bottom:10px;padding:14px 15px 13px;
  border:1px solid var(--border);border-radius:18px;text-align:left;font:inherit;color:var(--text);cursor:pointer;
  background:linear-gradient(180deg,rgba(22,30,48,.95),rgba(18,24,42,.95));-webkit-tap-highlight-color:transparent}
.gv-card:active{transform:scale(.99)}
.gv-meta,.gv-sh-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.gv-id{font-family:'Rajdhani','Exo 2',sans-serif;font-weight:700;font-size:14px;color:#A893FF}
.gv-kind{font-size:10.5px;font-weight:600;color:var(--muted);padding:3px 8px;border-radius:7px;background:rgba(107,130,168,.12)}
.gv-time{display:inline-flex;align-items:center;gap:4px;margin-left:auto;font-size:11.5px;font-weight:600;color:#00D4FF}
.gv-sh-meta .gv-time{margin-left:0}
.gv-time svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.gv-title{display:block;font-size:15px;font-weight:600;line-height:1.35;color:#E8F0FF}
.gv-title.sm{font-size:13.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gv-card .gov-bar{height:7px;margin:12px 0 8px;border-radius:4px}
.gv-turn{display:flex;align-items:center;gap:10px}
.gv-track{position:relative;flex:1;height:4px;border-radius:2px;background:rgba(107,130,168,.18)}
.gv-track i{position:absolute;left:0;top:0;bottom:0;border-radius:2px;background:linear-gradient(90deg,#7B5CFF,#00D4FF)}
.gv-track b{position:absolute;top:-4px;width:2px;height:12px;border-radius:1px;background:#E8F0FF;transform:translateX(-1px)}
.gv-turn span{flex:none;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.gv-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}
.gv-verdict{flex:1;min-width:0;font-size:12px;font-weight:600;line-height:1.35}
.gv-verdict.ok{color:var(--green)} .gv-verdict.bad{color:#8FA3C9}
.gv-you{flex:none;white-space:nowrap;font-size:11.5px;font-weight:700;padding:5px 11px;border-radius:999px}
.gv-you.todo{color:#0B0F1A;background:linear-gradient(90deg,#A893FF,#00D4FF)}
.gv-you.done{color:var(--green);background:rgba(62,207,142,.12)}
.gv-you.done.n{color:#f06a6a;background:rgba(240,106,106,.12)}
.gv-you.done.v{color:#c77dff;background:rgba(176,74,232,.14)}
.gv-you.done.a{color:#a7b0c2;background:rgba(138,147,166,.14)}

.gv-recent{border:1px solid var(--border);border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,rgba(22,30,48,.92),rgba(18,24,42,.92))}
.gv-row{position:relative;display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border:0;background:none;
  text-align:left;font:inherit;color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent}
.gv-row+.gv-row::before{content:'';position:absolute;top:0;left:52px;right:0;height:1px;background:var(--border)}
.gv-row:active{background:rgba(123,92,255,.07)}
.gv-st{display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:rgba(107,130,168,.14)}
.gv-st svg{width:15px;height:15px;fill:none;stroke:var(--muted);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.gv-st.passed{background:rgba(62,207,142,.13)} .gv-st.passed svg{stroke:#3ecf8e}
.gv-st.rejected,.gv-st.failed{background:rgba(240,106,106,.13)}
.gv-st.rejected svg,.gv-st.failed svg{stroke:#f06a6a}
.gv-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.gv-sub{font-size:11.5px;color:var(--muted)}
.gv-mini .gov-bar{height:3px;margin:5px 0 0;opacity:.8}
.gv-pill{flex:none;font-size:10.5px;font-weight:700;padding:4px 9px;border-radius:999px;color:var(--muted);background:rgba(107,130,168,.13)}
.gv-pill.passed{color:#3ecf8e;background:rgba(62,207,142,.12)}
.gv-pill.rejected,.gv-pill.failed{color:#f06a6a;background:rgba(240,106,106,.12)}
.gv-pill.voting{color:#00D4FF;background:rgba(0,212,255,.1)}
.gv-note{margin:16px 6px 0;text-align:left;line-height:1.55}

#gov-sheet .gov-title{font-size:17px;margin:0 0 12px}
.gv-tally{padding:12px 14px;margin-bottom:10px;border:1px solid var(--border);border-radius:16px;background:rgba(18,24,42,.7)}
.gv-tally .gov-bar{height:8px;margin:2px 0 12px;border-radius:4px}
.gv-legend{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin-bottom:10px}
.gv-legend span{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.gv-legend i{width:8px;height:8px;border-radius:2px;flex:none}
.gv-legend em{font-style:normal;flex:1;min-width:0}
.gv-legend b{color:#E8F0FF;font-weight:700;font-variant-numeric:tabular-nums}
.gv-legend .y i{background:#3ecf8e} .gv-legend .n i{background:#f06a6a}
.gv-legend .v i{background:#b04ae8} .gv-legend .a i{background:#8a93a6}
.gv-tally .gv-verdict{margin-top:8px}
.gv-ends{font-size:12px;color:var(--muted);margin:0 2px 12px}

.gv-vote{margin:16px 0 4px;padding:14px;border:1px solid rgba(123,92,255,.35);border-radius:18px;
  background:radial-gradient(120% 100% at 0% 0%,rgba(123,92,255,.12),transparent 60%),rgba(18,24,42,.8)}
.gv-vote-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px}
.gv-vote-h b{font-size:14.5px;font-weight:700}
.gv-vote-h span{font-size:11.5px;color:var(--muted);text-align:right}
.gv-vote .gov-opts{margin:0 0 12px}
.gv-o{display:flex;align-items:center;justify-content:center;gap:7px;padding:12px 6px;border-radius:13px;font:inherit;
  font-size:13px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:#12182A;color:var(--text);
  transition:background .15s,border-color .15s,box-shadow .15s}
.gv-o svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.gv-o.y{color:#3ecf8e} .gv-o.n{color:#f06a6a} .gv-o.v{color:#c77dff} .gv-o.a{color:#a7b0c2}
.gv-o.was{border-style:dashed}
.gv-o.on.y{background:rgba(62,207,142,.14);border-color:#3ecf8e;box-shadow:0 0 18px rgba(62,207,142,.2)}
.gv-o.on.n{background:rgba(240,106,106,.14);border-color:#f06a6a;box-shadow:0 0 18px rgba(240,106,106,.2)}
.gv-o.on.v{background:rgba(176,74,232,.16);border-color:#c77dff;box-shadow:0 0 18px rgba(176,74,232,.22)}
.gv-o.on.a{background:rgba(138,147,166,.16);border-color:#a7b0c2}
.gv-compose{border:1px solid var(--border);border-radius:13px;background:#0F1424;padding:10px 12px 8px;margin-bottom:10px}
.gv-compose:focus-within{border-color:rgba(0,212,255,.55)}
.gv-compose textarea{display:block;width:100%;min-height:44px;resize:none;border:0;outline:0;background:none;padding:0;
  color:var(--text);font:inherit;font-size:13.5px;line-height:1.5}
.gv-compose textarea::placeholder{color:#55688C}
.gv-compose-f{display:flex;justify-content:space-between;gap:8px;margin-top:6px;font-size:10.5px;color:var(--muted)}
.gv-compose-f b{flex:none;white-space:nowrap;font-weight:600;font-variant-numeric:tabular-nums}
.gv-compose-f b.over{color:var(--red)}
.gv-pick{margin:4px 2px 0;font-size:12px;color:var(--muted)}

.gv-filter{display:flex;gap:6px;margin:0 2px 10px}
.gv-filter button{padding:6px 12px;border-radius:999px;border:1px solid var(--border);background:none;color:var(--muted);
  font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.gv-filter button.on{color:#0B0F1A;background:#00D4FF;border-color:#00D4FF}
#gov-vals[data-f="yes"] .gov-voter[data-v="no"],#gov-vals[data-f="no"] .gov-voter[data-v="yes"],
#gov-vals[data-f="memo"] .gov-voter:not([data-m]){display:none !important}
.gv-filter{flex-wrap:wrap}
.gv-comments .gov-memo{margin-left:64px}
.gov-voter{border:1px solid var(--border);background:rgba(18,24,42,.7);border-radius:13px;padding:9px 11px}
.gov-voter-top{gap:10px}
.gov-who{display:flex;flex-direction:column;line-height:1.25;font-weight:600}
.gov-who small{font-size:11px;font-weight:500;color:var(--muted)}
.gv-ava{position:relative;display:grid;place-items:center;width:30px;height:30px;flex:none;border-radius:50%;overflow:hidden;
  background:linear-gradient(135deg,hsl(var(--h) 70% 55%),hsl(calc(var(--h) + 60) 70% 40%))}
.gv-ava em{font-style:normal;font-size:13px;font-weight:700;color:#fff}
.gv-ava img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#12182A}
.gv-comments .gov-memo{margin:8px 0 0 40px;padding:9px 11px;border-radius:4px 12px 12px 12px;background:rgba(123,92,255,.08);
  border:1px solid rgba(123,92,255,.18)}

/* ══ core assets: market, stake, peg (core.js) ══ */
.core-cell{position:relative;overflow:hidden}
.core-top .cx-ch{margin-left:auto;padding:2px 7px;border-radius:999px;font-size:10.5px;font-weight:700;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.core-top .cx-ch:empty{display:none}
.cx-ch.up{color:#3ecf8e;background:rgba(62,207,142,.12)}
.cx-ch.down{color:#f06a6a;background:rgba(240,106,106,.12)}
.cx-zero .core-usd,.cx-zero .core-qty{display:none}
.cx-empty:empty,.cx-split:empty,.cx-peg:empty,.cx-mk:empty{display:none}
.cx-empty{display:flex;flex-direction:column;gap:9px;margin-top:10px}
.cx-empty>span:first-child{font-size:12.5px;color:var(--muted)}
.cx-acts{display:flex;gap:6px}
.cx-acts button{flex:1;padding:6px 0;border-radius:9px;border:1px solid rgba(0,212,255,.35);background:rgba(0,212,255,.07);
  color:#00D4FF;font:inherit;font-size:11px;font-weight:600;cursor:pointer}
.cx-acts button:active,.cx-cta:active{transform:scale(.97)}
.cx-split,.cx-peg{margin-top:10px}
.cx-bar{position:relative;height:4px;border-radius:2px;background:rgba(107,130,168,.2);overflow:hidden}
.cx-bar i{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,#7B5CFF,#00D4FF)}
.cx-bar.peg i{background:linear-gradient(90deg,#E8C840,#00D4FF)}
.cx-split-l{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 8px;margin-top:6px;font-size:10.5px;
  color:var(--muted);font-variant-numeric:tabular-nums}
.cx-split-l span{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.cx-split-l i{width:6px;height:6px;border-radius:50%;flex:none;background:rgba(107,130,168,.45)}
.cx-split-l i.st{background:#7B5CFF}
.cx-cta{width:100%;margin-top:9px;padding:6px 8px;border-radius:9px;border:1px solid rgba(0,212,255,.4);
  background:rgba(0,212,255,.08);color:#00D4FF;font:inherit;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap}
.cx-mk{margin:auto -15px -13px;padding-top:12px}
.cx-px{display:flex;align-items:baseline;justify-content:space-between;padding:0 15px 2px;font-size:11.5px;
  font-weight:600;color:#C9D6F2;font-variant-numeric:tabular-nums}
.cx-px em{font-style:normal;font-size:10px;color:var(--muted);font-weight:500}
.cx-spark{display:block;width:100%;height:34px}
/* ══ the room behind the screens (scene.js) ══
   Everything that moves is a transform or an opacity, which the GPU does on
   its own; nothing large is repainted while a screen changes. The room's
   colour lives only on the two glows and the horizon, and changes while
   they are faded out. */
body.has-scene .orb{display:none}
#fw-scene{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;perspective:520px;
  --tx:0;--ty:0;--sc-a:#7B5CFF;--sc-b:#00D4FF;contain:strict}
#fw-scene .sc-far{position:absolute;inset:-10%;opacity:.55;will-change:transform;
  background:
    radial-gradient(1px 1px at 12% 18%,#fff,transparent),radial-gradient(1px 1px at 68% 12%,#cfd8ff,transparent),
    radial-gradient(1.5px 1.5px at 84% 44%,#fff,transparent),radial-gradient(1px 1px at 28% 62%,#cfd8ff,transparent),
    radial-gradient(1px 1px at 52% 34%,#fff,transparent),radial-gradient(1.5px 1.5px at 8% 82%,#cfd8ff,transparent),
    radial-gradient(1px 1px at 92% 88%,#fff,transparent),radial-gradient(1px 1px at 44% 90%,#cfd8ff,transparent);
  background-size:300px 300px;
  transform:translate3d(calc(var(--tx) * 6px),calc(var(--ty) * 6px),0)}
#fw-scene .sc-room{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform;
  transform:rotateY(calc(var(--tx) * 7deg)) rotateX(calc(var(--ty) * -5deg))}
#fw-scene .sc-floor,#fw-scene .sc-ceil{position:absolute;left:-60%;right:-60%;height:70%;will-change:transform;
  background:
    linear-gradient(rgba(140,120,255,.26) 1px,transparent 1px) 0 0/56px 56px,
    linear-gradient(90deg,rgba(140,120,255,.18) 1px,transparent 1px) 0 0/56px 56px}
#fw-scene .sc-floor{bottom:-22%;transform-origin:50% 0;transform:rotateX(78deg)}
#fw-scene .sc-ceil{top:-22%;transform-origin:50% 100%;transform:rotateX(-78deg);opacity:.5}
/* the far ends of floor and ceiling fade into the dark at the horizon: a flat
   overlay does it (a mask on the tilted planes left a hard-edged band) */
#fw-scene .sc-fog{position:absolute;left:0;right:0;top:50%;height:44%;transform:translateY(-50%);
  background:linear-gradient(180deg,rgba(11,15,26,0),rgba(11,15,26,.92) 40%,rgba(11,15,26,.92) 60%,rgba(11,15,26,0))}
/* the horizon is a soft band of light, not a line: a sharp line stays put
   while the page scrolls over it and reads as something in front */
#fw-scene .sc-hz{position:absolute;left:-10%;right:-10%;top:50%;height:46px;margin-top:-23px;opacity:.32;
  transition:opacity .2s ease;filter:blur(6px);
  background:radial-gradient(closest-side,color-mix(in srgb,var(--sc-b) 60%,var(--sc-a)),transparent)}
#fw-scene .sc-hz::before{content:'';position:absolute;left:0;right:0;top:-70px;height:186px;opacity:.35;
  background:radial-gradient(closest-side,var(--sc-b),transparent)}
#fw-scene .sc-glow{position:absolute;width:520px;height:520px;border-radius:50%;opacity:.3;will-change:transform,opacity;
  transition:opacity .2s ease}
#fw-scene .sc-glow.a{top:-260px;right:-240px;background:radial-gradient(closest-side,var(--sc-a),transparent);
  transform:translate3d(calc(var(--tx) * 26px),calc(var(--ty) * 26px),0)}
#fw-scene .sc-glow.b{bottom:-300px;left:-260px;opacity:.2;background:radial-gradient(closest-side,var(--sc-b),transparent);
  transform:translate3d(calc(var(--tx) * 34px),calc(var(--ty) * 34px),0)}
#fw-scene.sc-dim .sc-glow,#fw-scene.sc-dim .sc-hz{opacity:0}

/* moving between rooms: the floor runs one square forward (or back) */
#fw-scene.sc-move .sc-floor{animation:sc-run .5s cubic-bezier(.22,1,.36,1)}
#fw-scene.sc-move .sc-ceil{animation:sc-run-c .5s cubic-bezier(.22,1,.36,1)}
#fw-scene.sc-back .sc-floor{animation:sc-run-b .5s cubic-bezier(.22,1,.36,1)}
#fw-scene.sc-back .sc-ceil{animation:sc-run-cb .5s cubic-bezier(.22,1,.36,1)}
@keyframes sc-run{from{transform:rotateX(78deg) translateY(-56px)}to{transform:rotateX(78deg) translateY(0)}}
@keyframes sc-run-c{from{transform:rotateX(-78deg) translateY(56px)}to{transform:rotateX(-78deg) translateY(0)}}
@keyframes sc-run-b{from{transform:rotateX(78deg) translateY(56px)}to{transform:rotateX(78deg) translateY(0)}}
@keyframes sc-run-cb{from{transform:rotateX(-78deg) translateY(-56px)}to{transform:rotateX(-78deg) translateY(0)}}

/* the screen itself: a short, eased move out of the depth or from the side */
/* the old .22s fade would start over the moment a room class comes off, a
   blink at the end of every move: with the scene, the room classes are the
   only entrance */
body.has-scene .step.on{animation:none}
.step.on.room-in,.step.on.room-out,.step.on.room-right,.step.on.room-left{will-change:transform,opacity;backface-visibility:hidden}
body.has-scene .step.on.room-in{animation:room-in .42s cubic-bezier(.22,1,.36,1) both}
body.has-scene .step.on.room-out{animation:room-out .42s cubic-bezier(.22,1,.36,1) both}
body.has-scene .step.on.room-right{animation:room-right .42s cubic-bezier(.22,1,.36,1) both}
body.has-scene .step.on.room-left{animation:room-left .42s cubic-bezier(.22,1,.36,1) both}
@keyframes room-in{from{opacity:0;transform:scale(.965) translate3d(0,8px,0)}to{opacity:1;transform:none}}
@keyframes room-out{from{opacity:0;transform:scale(1.03)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  #fw-scene *{animation:none !important;transform:none !important}
  .step.on.room-in,.step.on.room-out,.step.on.room-right,.step.on.room-left{animation:none}
}
/* the screen being left stays drawn for the move and goes the other way */
body.has-scene .step.leave-right,body.has-scene .step.leave-left,
body.has-scene .step.leave-in,body.has-scene .step.leave-out{display:flex !important;position:fixed;left:0;right:0;
  top:calc(-1 * var(--ly,0px));margin:0 auto;pointer-events:none;z-index:1;will-change:transform,opacity}
body.has-scene .step.leave-right{animation:leave-right .42s cubic-bezier(.22,1,.36,1) both}
body.has-scene .step.leave-left{animation:leave-left .42s cubic-bezier(.22,1,.36,1) both}
body.has-scene .step.leave-in{animation:leave-in .4s cubic-bezier(.22,1,.36,1) both}
body.has-scene .step.leave-out{animation:leave-out .4s cubic-bezier(.22,1,.36,1) both}
@keyframes leave-right{from{opacity:1;transform:translate3d(var(--drag,0px),0,0)}to{opacity:0;transform:translate3d(-26%,0,0) scale(.97)}}
@keyframes leave-left{from{opacity:1;transform:translate3d(var(--drag,0px),0,0)}to{opacity:0;transform:translate3d(26%,0,0) scale(.97)}}
@keyframes leave-in{from{opacity:1;transform:none}to{opacity:0;transform:scale(1.04)}}
@keyframes leave-out{from{opacity:1;transform:none}to{opacity:0;transform:scale(.96)}}
@keyframes room-right{from{opacity:0;transform:translate3d(26%,0,0) scale(.97)}to{opacity:1;transform:none}}
@keyframes room-left{from{opacity:0;transform:translate3d(-26%,0,0) scale(.97)}to{opacity:1;transform:none}}

/* the tab bar: one light that slides from tab to tab instead of each tab lighting up on its own */
.tabs .tab-ind{position:absolute;top:1px;bottom:1px;left:0;z-index:2;pointer-events:none;
  transition:transform .42s cubic-bezier(.22,1,.36,1),width .42s cubic-bezier(.22,1,.36,1)}
.tabs .tab-ind::before{content:'';position:absolute;left:14%;right:14%;bottom:0;height:2px;
  background:linear-gradient(90deg,transparent,#00D4FF,transparent)}
.tabs .tab-ind::after{content:'';position:absolute;left:50%;bottom:-30px;width:64px;height:42px;transform:translateX(-50%);
  border-radius:50%;background:radial-gradient(closest-side,rgba(0,212,255,.35),transparent)}
.tabs.has-ind .tab.sel::before,.tabs.has-ind .tab.sel::after{display:none}
.tabs .tab,.tabs .tab svg{transition:color .3s ease,stroke .3s ease}
.tabs.dragging .tab-ind{transition:none}
@media (prefers-reduced-motion:reduce){
  body.has-scene .step.leave-right,body.has-scene .step.leave-left,body.has-scene .step.leave-in,body.has-scene .step.leave-out{display:none !important}
  .tabs .tab-ind{transition:none}
}
/* the search button next to "See all" on the Stake screen */
.stk-acts{display:flex;align-items:center;gap:8px}
.stk-find{display:grid;place-items:center;width:32px;height:32px;flex:none;border-radius:50%;cursor:pointer;
  border:1px solid rgba(0,212,255,.35);background:rgba(0,212,255,.07);-webkit-tap-highlight-color:transparent}
.stk-find:active{transform:scale(.94)}
.stk-find svg{width:16px;height:16px;fill:none;stroke:#00D4FF;stroke-width:2.2;stroke-linecap:round}