:root{
  --bg:        #0e1116;
  --bg2:       #161b22;
  --card:      #171d26;
  --line:      #232b37;
  --tx:        #e6edf3;
  --dim:       #7d8894;
  --acc:       #2f81f7;
  --up:        #2ea043;
  --dn:        #f85149;
  --warn:      #d29922;
  --r:         14px;
  /* Grafiko zymes. NEnaudojam --acc/--up: Telegram tema jas persviedzia ir
     jos gali sutapti — taip ijimas ir pelningas isejimas buvo tos pacios
     spalvos. Sios penkios parinktos taip, kad skirtusi tarpusavyje. */
  --mk-in:     #4c8dff;
  --mk-cut:    #e8a33d;
  --mk-win:    #2ecc71;
  --mk-loss:   #f2545b;
  --mk-liq:    #b06cf0;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:var(--bg);color:var(--tx);
  font:15px/1.45 -apple-system,BlinkMacSystemFont,"SF Pro Text",Roboto,system-ui,sans-serif;
  overscroll-behavior-y:none}
.mono{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-variant-numeric:tabular-nums}
b,.num{font-variant-numeric:tabular-nums}
body{padding-left:var(--sa-l,0px);padding-right:var(--sa-r,0px);
  padding-top:var(--sa-t,0px);padding-bottom:var(--sa-b,0px)}
#app{padding:0 0 32px;max-width:720px;margin:0 auto;
  width:100%;                      /* niekada neplatesnis uz matoma plota */
  box-sizing:border-box}
/* ---- ekranai ---- */
.view{display:none;padding:0 14px}
.view.active{display:block;animation:in .18s ease}
@keyframes in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.hdr{display:flex;align-items:flex-start;gap:10px;padding:16px 0 12px;position:sticky;top:0;
  background:linear-gradient(var(--bg) 72%,transparent);z-index:5}
.hdr h1{font-size:22px;font-weight:680;margin:0;letter-spacing:-.02em}
.hdr .grow{flex:1;min-width:0}
.sub{color:var(--dim);font-size:12.5px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.icon-btn{width:36px;height:36px;flex:none;border:1px solid var(--line);background:var(--card);
  color:var(--tx);border-radius:11px;font-size:20px;line-height:1;cursor:pointer}
.icon-btn.back{font-size:26px;padding-bottom:3px}
.icon-btn:active{background:var(--bg2)}
/* ---- segmentai / tabai ---- */
.seg{display:flex;gap:6px;margin:0 0 14px}
.seg button{flex:1;padding:7px 0;border:1px solid var(--line);background:var(--card);color:var(--dim);
  border-radius:10px;font-size:13px;font-weight:600;cursor:pointer}
.seg button.on{background:var(--acc);border-color:var(--acc);color:#fff}
.tabs{display:flex;gap:18px;border-bottom:1px solid var(--line);margin:6px 0 14px}
.tabs button{background:none;border:0;color:var(--dim);font-size:14px;font-weight:600;
  padding:9px 0 11px;cursor:pointer;position:relative}
.tabs button.on{color:var(--tx)}
.tabs button.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--acc);border-radius:2px}
.tabs i{font-style:normal;font-size:11px;background:var(--line);border-radius:8px;padding:1px 6px;
  margin-left:3px;color:var(--tx)}
.tab{display:none}.tab.active{display:block}
/* ---- korteles ---- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:13px 14px;margin-bottom:10px}
.card h3{margin:0 0 10px;font-size:12px;font-weight:700;color:var(--dim);
  text-transform:uppercase;letter-spacing:.06em}
/* saraso elementas */
.wrow{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r);padding:11px 12px;margin-bottom:9px;cursor:pointer}
.wrow:active{background:var(--bg2)}
.wrow .nm{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
#sort-btn{flex:none;white-space:nowrap}
.wr-chip{font-size:14px;font-weight:700;padding:6px 8px;border-radius:9px;flex:none;
  min-width:52px;text-align:center;line-height:1.1}
.wr-chip i{font-style:normal;font-size:10px;opacity:.75}
.spark{width:58px;height:26px;flex:none}
.pill{font-size:10.5px;padding:2px 6px;border-radius:6px;background:var(--bg2);color:var(--dim);
  border:1px solid var(--line);flex:none;white-space:nowrap}
/* pranesimu jungiklis */
.bell{width:34px;height:34px;flex:none;border:1px solid var(--line);background:var(--bg2);
  border-radius:10px;font-size:15px;line-height:1;cursor:pointer;padding:0;
  display:flex;align-items:center;justify-content:center}
.bell:active{background:var(--acc);border-color:var(--acc)}
.bell.off{opacity:.55;border-style:dashed}
.bell.big{width:38px;height:38px;font-size:17px}
.wrow.muted{opacity:.62}
.mtag{font-style:normal;font-size:10px;font-weight:700;color:var(--dim);
  background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:1px 5px;
  vertical-align:middle;margin-left:4px}
.mute-note{color:var(--dim);font-size:11.5px;margin:-6px 0 10px}
/* hero + ziedas */
.hero{display:flex;gap:14px;align-items:center;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r);padding:14px;margin-bottom:12px}
.ring{position:relative;width:104px;height:104px;flex:none}
.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:9;stroke-linecap:round}
.ring .track{stroke:var(--line)}
.ring .fill{stroke:var(--up);transition:stroke-dasharray .5s ease}
.ring-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:1px}
.ring-c b{font-size:23px;font-weight:700;letter-spacing:-.02em}
.ring-c span{font-size:8.5px;color:var(--dim);letter-spacing:.08em;font-weight:600}
.hero-side{flex:1;display:flex;flex-direction:column;gap:7px;min-width:0}
.kv{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.kv span{color:var(--dim);font-size:12.5px}
.kv b{font-size:14.5px;font-weight:650}
/* metriku tinklelis */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:10px}
.m{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.m span{display:block;color:var(--dim);font-size:11.5px;margin-bottom:3px}
.m b{font-size:16px;font-weight:650}
/* pastabos */
.note{display:flex;gap:8px;align-items:flex-start;background:#1d1a10;border:1px solid #3d3316;
  border-radius:12px;padding:10px 12px;margin-bottom:8px;font-size:13.5px;line-height:1.4}
.note.ok{background:#0f1c13;border-color:#1c3d24}
.note em{font-style:normal;flex:none}
/* pozicijos */
.pos{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:12px 13px;margin-bottom:9px}
.pos .top{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.pos .top b{font-size:15.5px;font-weight:650;flex:1;min-width:0;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.side{font-size:11px;font-weight:700;padding:2px 8px;border-radius:7px;flex:none}
.side.L{background:rgba(46,160,67,.16);color:var(--up)}
.side.S{background:rgba(248,81,73,.16);color:var(--dn)}
.pos .g{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:8px}
.pos .g div span{display:block;color:var(--dim);font-size:11px}
.pos .g div b{font-size:13.5px}
.pos .g div u{display:block;text-decoration:none;font-size:11.5px;font-weight:650;margin-top:1px}
.pctrow{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--dim);
  border-top:1px solid var(--line);padding-top:8px;margin-bottom:9px}
.pctrow b{font-weight:700}
/* ispejimas, kai birzos entryPx nekyla is realiu sandoriu (ADL, koregavimai) */
.mismatch{background:#1d1a10;border:1px solid #3d3316;border-radius:11px;
  padding:9px 11px;margin-bottom:9px}
.mismatch.partial{background:#101820;border-color:#22303d}
.mismatch.partial .mm-h{color:var(--dim)}
.mismatch.partial .mm-f{border-top-color:#22303d}
.mm-h{font-size:12px;font-weight:700;color:var(--warn);margin-bottom:8px}
.mm-g{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:8px}
.mm-g div span{display:block;color:var(--dim);font-size:10.5px}
.mm-g div b{font-size:13px}
.mm-f{font-size:11.5px;color:var(--dim);line-height:1.45;
  border-top:1px solid #3d3316;padding-top:7px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:11.5px;padding:3px 9px;border-radius:8px;border:1px solid var(--line);
  background:var(--bg2);color:var(--dim)}
.chip.tp{color:var(--up);border-color:rgba(46,160,67,.35)}
.chip.sl{color:var(--dn);border-color:rgba(248,81,73,.35)}
/* sandoriu eilutes */
.f{display:flex;align-items:center;gap:10px;padding:9px 2px;border-bottom:1px solid var(--line)}
.f:last-child{border-bottom:0}
.f .dot{width:7px;height:7px;border-radius:50%;flex:none}
.f .c{flex:1;min-width:0}
.f .c b{display:block;font-size:13.5px;font-weight:600;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.f .c span{color:var(--dim);font-size:11.5px}
.f .r{text-align:right;flex:none}
.f .r b{font-size:13.5px}.f .r span{display:block;color:var(--dim);font-size:11px}
/* moneta */
.coin{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.coin:last-child{border-bottom:0}
.coin .nm{flex:1;min-width:0;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.coin .bar{height:5px;border-radius:3px;background:var(--line);flex:none;width:74px;overflow:hidden}
.coin .bar i{display:block;height:100%;border-radius:3px}
/* dienu histograma — CSS matmenys BUTINI, kitaip JS nustatytas
   width = plotis*dpr issipucia ir piesinys atsiduria uz matomo lauko */
#daily-chart{width:100%;height:120px;display:block}
/* grafikas */
.chart-wrap{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:8px;margin-bottom:10px}
/* touch-action:none butinas — kitaip narsykle pasiima gestus sau */
#chart{width:100%;display:block;touch-action:none;cursor:grab;user-select:none}
#chart:active{cursor:grabbing}
.zoombar{display:flex;align-items:center;gap:5px;margin-top:8px;padding-top:8px;
  border-top:1px solid var(--line)}
.zoombar button{width:34px;height:30px;border:1px solid var(--line);background:var(--bg2);
  color:var(--tx);border-radius:9px;font-size:15px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center}
.zoombar button:active{background:var(--acc);border-color:var(--acc);color:#fff}
.zoombar span{margin-left:auto;color:var(--dim);font-size:11.5px}
.legend{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;font-size:12px;color:var(--dim)}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;
  vertical-align:middle}
/* bendra */
.up{color:var(--up)}.dn{color:var(--dn)}.dim{color:var(--dim)}
.row-min{display:flex;justify-content:space-between;color:var(--dim);font-size:11.5px;margin-top:6px}
.btn{padding:11px 16px;border-radius:11px;border:1px solid var(--line);background:var(--card);
  color:var(--tx);font-size:14px;font-weight:600;cursor:pointer}
.btn.primary{background:var(--acc);border-color:var(--acc);color:#fff}
.btn.sm{padding:7px 12px;font-size:12.5px;border-radius:9px}
.empty{text-align:center;padding:48px 20px;color:var(--dim)}
.empty p{margin:0 0 14px}
.skl{background:linear-gradient(90deg,var(--card) 25%,var(--bg2) 50%,var(--card) 75%);
  background-size:200% 100%;animation:sh 1.2s infinite;border-radius:var(--r);height:70px;
  margin-bottom:9px}
@keyframes sh{0%{background-position:200% 0}100%{background-position:-200% 0}}
/* modalas */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.62);display:flex;align-items:flex-end;
  justify-content:center;z-index:50}
/* butina: [hidden] display:none yra silpnesnis uz .modal{display:flex} */
.modal[hidden]{display:none}
.sheet{background:var(--card);border:1px solid var(--line);border-radius:18px 18px 0 0;
  padding:18px 16px 26px;width:100%;max-width:720px;animation:up .2s ease}
@keyframes up{from{transform:translateY(30px)}to{transform:none}}
.sheet h3{margin:0 0 14px;font-size:17px}
.sheet input{width:100%;padding:12px 13px;margin-bottom:9px;border-radius:11px;
  border:1px solid var(--line);background:var(--bg2);color:var(--tx);font-size:15px;
  font-family:ui-monospace,Menlo,Consolas,monospace}
.sheet input:focus{outline:none;border-color:var(--acc)}
.sheet-btns{display:flex;gap:9px;margin-top:6px}
.sheet-btns .btn{flex:1}
.hint{color:var(--dim);font-size:12.5px;margin-top:10px;min-height:16px}
/* ---- zurnalas ---- */
.jw{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:12px 13px;margin-bottom:9px}
.jw-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:9px}
.jw-h b{font-size:15px;font-weight:650}
.jw-h span{font-weight:700;font-size:15px}
.jw-g{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:8px}
.jw-g div span{display:block;color:var(--dim);font-size:11px}
.jw-g div b{font-size:13px}
.jw-cmp{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--dim);
  border-top:1px solid var(--line);padding-top:8px}
.jw-cmp b{font-weight:700}
.jw-v{font-size:11.5px;margin-top:6px}
.jw-v .warn{color:var(--warn)}
.jrow{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:10px 12px;margin-bottom:8px}
.jr-h{display:flex;align-items:center;gap:7px;margin-bottom:5px}
.jr-h b{font-size:14.5px;font-weight:650}
.jr-h .grow{flex:1}
.jr-b{font-size:11.5px;color:var(--dim);line-height:1.5}
.btn.flag{padding:7px 10px}
.card.mine{border-color:#2a3a4d;background:linear-gradient(180deg,#18202b,#171d26)}
.card.mine .jw-h{margin-bottom:8px}
.card.mine .jw-g{margin-bottom:6px}
/* mano poziciju zenklelis saraše — atskiriamas nuo ju "N atv." */
.pill.mypill{background:rgba(47,129,247,.14);border-color:rgba(47,129,247,.45);
  color:#7fb4ff;font-weight:700}
.pill.mypill b{font-weight:700;opacity:.75}
.w-mine{display:flex;justify-content:space-between;align-items:center;gap:8px;
  background:rgba(47,129,247,.1);border:1px solid rgba(47,129,247,.35);
  border-radius:11px;padding:9px 12px;margin-bottom:10px;font-size:12.5px}
.w-mine b{font-weight:700}
/* maker = pade limit orderi ir lauke; taker = kirto spreada */
.mt{font-style:normal;font-size:10px;font-weight:700;padding:1px 5px;border-radius:5px;
  border:1px solid var(--line);letter-spacing:.02em}
.mt.mk{color:#7fb4ff;border-color:rgba(47,129,247,.4);background:rgba(47,129,247,.1)}
.mt.tk{color:var(--warn);border-color:var(--warn-bg);background:var(--warn-bg)}
/* redagavimo laukai + naudotojo pastabos */
.fl{display:block;font-size:11px;color:var(--dim);margin:2px 0 5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.05em}
.sheet textarea{width:100%;padding:11px 12px;margin-bottom:9px;border-radius:11px;
  border:1px solid var(--line);background:var(--bg2);color:var(--tx);font-size:14px;
  font-family:inherit;resize:vertical}
.sheet textarea:focus{outline:none;border-color:var(--acc)}
.addrbox{background:var(--bg2);border:1px solid var(--line);border-radius:11px;
  padding:10px 12px;margin-bottom:12px;font-family:ui-monospace,Menlo,monospace;
  font-size:11.5px;word-break:break-all;cursor:pointer;color:var(--dim)}
.addrbox:active{border-color:var(--acc);color:var(--tx)}
.unote{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--acc);
  border-radius:12px;padding:10px 13px;margin-bottom:10px;font-size:13.5px;line-height:1.5}
.unote b{display:block;font-size:11px;color:var(--dim);text-transform:uppercase;
  letter-spacing:.05em;margin-bottom:5px;font-weight:700}
.pill.cur{background:rgba(210,153,34,.14);border-color:rgba(210,153,34,.45);color:#e0b350}
.authbox{background:#1d1a10;border:1px solid #3d3316;border-radius:var(--r);
  padding:14px 16px;margin:14px;font-size:14px;line-height:1.5}
.authbox b{display:block;margin-bottom:6px;color:var(--warn);font-size:15px}
.chk{display:flex;align-items:center;gap:10px;margin:10px 0 2px;cursor:pointer}
.chk input{width:18px;height:18px;flex:none;accent-color:var(--acc)}
.chk span{font-size:13.5px}
.chk i{display:block;font-style:normal;font-size:11.5px;color:var(--dim)}
.sheet input:disabled,.sheet textarea:disabled{opacity:.55}
.jr-line{display:flex;align-items:baseline;gap:8px;line-height:1.6}
.jr-line span{color:var(--dim);font-size:12px;min-width:106px;flex:none}
.jr-line b{font-size:13.5px;font-weight:650}
.jr-line i{font-style:normal;color:var(--dim);font-size:11.5px;margin-left:auto}
.jr-cmp{border-top:1px solid var(--line);margin-top:8px;padding-top:8px;font-size:12.5px}
.jrow .bell{width:30px;height:30px;font-size:13px;margin-left:6px}
.btn.danger{border-color:#5a2320;color:var(--dn);background:#1c1211}
.btn.danger:active{background:#2a1715}
.subbar{display:flex;align-items:center;gap:10px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;margin-bottom:10px}
.subbar div{flex:1;min-width:0;display:flex;flex-direction:column}
.subbar b{font-size:13.5px}
.subbar span{font-size:11.5px;color:var(--dim)}
.subbar.ok{background:#0f1c13;border-color:#1c3d24}
.subbar.warn{background:#1d1a10;border-color:#3d3316}
.pw-what{margin:0 0 10px;font-size:13.5px;color:var(--dim)}
.pw-list{margin:0 0 14px;padding-left:18px;font-size:13.5px;line-height:1.6}
.pw-list li{margin-bottom:4px}
.pw-price{font-size:15px;margin-bottom:8px}
.pw-price b{font-size:26px;font-weight:700;letter-spacing:-.02em}
.pw-price span{color:var(--dim);font-size:13px}
.pw-note{font-size:11.5px;color:var(--dim);line-height:1.45;margin-bottom:12px}
/* joks vaikas neturi teises isplesti puslapio i sonus */
html,body{overflow-x:hidden}
.view,.card,.wrow,.pos,.jrow,.hero{max-width:100%}
/* siauruose ekranuose antrastes mygtukai turi tilpti, o ne kysoti */
.hdr{flex-wrap:nowrap;min-width:0}
.hdr .grow{overflow:hidden}
.hdr h1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#sort-btn{max-width:96px;overflow:hidden;text-overflow:ellipsis}
@media (max-width:400px){
  .hdr{gap:6px}
  .icon-btn{width:32px;height:32px;font-size:18px}
  #sort-btn{padding-left:8px;padding-right:8px;font-size:12px}
}
/* ================= ŠVIESI TEMA =================
   Anksciau fonas ir tekstas ateidavo is Telegram temos, o korteles, linijos ir
   pastabu spalvos buvo iraSytos kietai tamsios. Sviesioje temoje gaudavosi
   tamsi kortele su tamsiu tekstu — neiskaitoma.
   Dabar VISOS spalvos yra tokenai; `data-theme="light"` uzdeda JS pagal
   `Telegram.WebApp.colorScheme`, o `prefers-color-scheme` lieka atsargai. */
:root{
  --up-bg:   rgba(46,160,67,.16);
  --dn-bg:   rgba(248,81,73,.16);
  --warn-bg: rgba(210,153,34,.14);
  --note-bg: #1d1a10;  --note-line: #3d3316;
  --ok-bg:   #0f1c13;  --ok-line:   #1c3d24;
  --info-bg: #101820;  --info-line: #22303d;
  --danger-bg: #1c1211; --danger-line: #5a2320;
  --shadow: rgba(0,0,0,.45);
}


/* kietai iraSytos spalvos -> tokenai */
.note,.authbox,.mismatch{background:var(--note-bg);border-color:var(--note-line)}
.note.ok,.subbar.ok{background:var(--ok-bg);border-color:var(--ok-line)}
.subbar.warn{background:var(--note-bg);border-color:var(--note-line)}
.mismatch.partial{background:var(--info-bg);border-color:var(--info-line)}
.mismatch.partial .mm-f{border-top-color:var(--info-line)}
.btn.danger{background:var(--danger-bg);border-color:var(--danger-line);color:var(--dn)}
.side.L{background:var(--up-bg);color:var(--up)}
.side.S{background:var(--dn-bg);color:var(--dn)}
.pill.cur{background:var(--warn-bg);border-color:var(--note-line);color:var(--warn)}
/* WIN RATE zenklelis: klases vietoj inline spalvu.
   `style="background:var(--up)1f"` buvo negaliojantis CSS ir fono visai nebuvo. */
.wr-chip.good{color:var(--up);background:var(--up-bg)}
.wr-chip.mid{color:var(--warn);background:var(--warn-bg)}
.wr-chip.bad{color:var(--dn);background:var(--dn-bg)}
/* sviesioje temoje korteles reikia atskirti nuo balto fono */
/* `:not(.on)` butinas: si taisykle specifiskesne uz `.seg button.on`, tad
   pasirinktas laikotarpis netekdavo zalio fono ir likdavo baltas tekstas ant
   pilko — nesimatydavo, kuri laikotarpi apskritai ziuri. */
/* melynos zymos: sviesioje temoje #7fb4ff ant balto beveik nesimato */
:root{--accent-tx:#7fb4ff;--accent-bg:rgba(47,129,247,.14);--accent-line:rgba(47,129,247,.45)}


.pill.mypill{background:var(--accent-bg);border-color:var(--accent-line);color:var(--accent-tx)}
.mt.mk{color:var(--accent-tx);border-color:var(--accent-line);background:var(--accent-bg)}
/* ===== platus langai =====
   Telegram Desktop Main App atiduoda VISO lango ploti, bet piesia programele
   desineje srityje. `margin:0 auto` tada centruoja stulpeli tos placios dezes
   viduryje — jis nukeliauja i desini krasta ir dalis lieka uz ekrano.
   (Islmatuota: stulpelis 720 px ties x=1370, kai langas 1920 ir pokalbiu
   sarasas uzima 0-740; 740 + (1920-720)/2 = 1340.)
   Todel nuo 900 px lygiuojam i kaire — ten programeles krastas visada matomas. */

/* matomo ploto dėžė: JS ideda tikrąjį plotį, #app centruojasi JAME */
body{width:var(--fit-w,auto);max-width:100%}
/* nepavyko pamatuoti — bent jau matoma */
html[data-fit="left"] #app{margin-left:0;margin-right:auto}
/* kalbos pasirinkimas */
.langrow{display:flex;align-items:center;width:100%;padding:13px 14px;margin-bottom:8px;
  background:var(--bg2);border:1px solid var(--line);border-radius:12px;
  color:var(--tx);font-size:15px;cursor:pointer;text-align:left}
.langrow span{flex:1}
.langrow em{font-style:normal;color:var(--acc);font-weight:700}
.langrow.on{border-color:var(--acc)}
.langrow:active{background:var(--card)}
/* [hidden] VISADA slepia. Klase su `display:` uz ji stipresne, ir tas jau
   kando du kartus: `.modal[hidden]`, paskui `.chk[hidden]` (svarnele
   „show to everyone" buvo matoma svetimiems). Uzkertam kelia visiems. */
[hidden]{display:none !important}
/* slinkimas vyksta MUSU dezeje, kurios auksti nurode Telegram */
html{height:var(--tg-vh,auto)}
body{height:var(--tg-vh,auto);overflow-y:auto;-webkit-overflow-scrolling:touch}
/* pridejimo eilute — tokio pat pavidalo kaip pinigines, saraso gale */
.addrow{width:100%;justify-content:flex-start;gap:10px;cursor:pointer;
  border-style:dashed;color:var(--dim);font-size:14.5px;font-family:inherit}
.addrow .plus{font-size:20px;line-height:1;color:var(--acc);font-weight:600}
.addrow:active{background:var(--bg2)}
/* uztemdytos pinigines: TUSCIOS formos, be jokiu skaiciu DOM'e */
.locked-wrap{position:relative;margin-bottom:9px}
.locked-rows{filter:blur(5px);pointer-events:none;user-select:none;opacity:.75}
.locked-note{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:8px;text-align:center;padding:0 16px}
.locked-note b{font-size:14px}
.locked-note span{font-size:12px;color:var(--dim)}
.lk{display:flex;align-items:center;gap:10px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r);padding:11px 12px;margin-bottom:9px}
.lk i{display:block;height:11px;border-radius:5px;background:var(--line);font-style:normal}
.lk .lk-chip{width:52px;height:34px;border-radius:9px;background:var(--line);flex:none}
.lk .lk-nm{flex:1;display:flex;flex-direction:column;gap:7px}
.lk .lk-spark{width:58px;height:24px;border-radius:6px;background:var(--line);flex:none}
/* sujungtu sandoriu zyme ir isskleidziamos detales */
.cnt{font-style:normal;font-size:11px;font-weight:700;padding:1px 6px;margin-left:6px;
  border-radius:6px;background:var(--accent-bg);border:1px solid var(--accent-line);
  color:var(--accent-tx);cursor:pointer;white-space:nowrap}
.f-sub{padding:2px 0 8px 34px}
.f-s{display:flex;align-items:baseline;gap:10px;font-size:12.5px;line-height:1.8;
  font-variant-numeric:tabular-nums}
.f-s span:first-child{flex:1}
.f-s b{font-weight:650}
/* OHLC langelis grafiko virsuje (kaip birzos terminaluose) */
.chart-wrap{position:relative}
.ohlc{position:absolute;top:6px;left:8px;z-index:2;pointer-events:none;
  display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;
  font-size:11px;font-variant-numeric:tabular-nums;color:var(--dim)}
.ohlc b{font-weight:650;color:var(--tx)}
.ohlc>b:first-child{font-size:13px}
.ohlc i{font-style:normal;padding:1px 5px;border-radius:5px;
  background:var(--bg2);border:1px solid var(--line);font-size:10px}
.ohlc span{display:inline-flex;gap:3px;align-items:baseline}
.ohlc .up b,.ohlc b.up{color:var(--up)}
.ohlc .dn b,.ohlc b.dn{color:var(--dn)}
#chart{touch-action:none}
/* ===== saraso eilute: pavadinimas matomas VISAS =====
   Anksciau jis buvo `nowrap` + `ellipsis` ir varzesi del vietos su zymomis,
   sparkline ir varpeliu — „Leveraged Equities" nusikirsdavo. Dabar vardas
   turi savo eilute, o visa kita rikiuojasi po juo. */
.wrow{align-items:flex-start;padding:12px}
.wr-chip{margin-top:2px}
.wrow .spark{align-self:center}
.wrow .bell{align-self:center}
@media (max-width:380px){
  .wrow .spark{width:44px}
  .wr-chip{min-width:46px;font-size:13px}
}
/* ===== zurnalas: nebesekamos sutrauktos ===== */
.gone{margin-top:10px}
.gone-h{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  padding:11px 13px;background:var(--card);border:1px dashed var(--line);
  border-radius:var(--r);color:var(--tx);cursor:pointer;font-family:inherit}
.gone-h span{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.gone-h b{font-size:13.5px;font-weight:650}
.gone-h i{font-style:normal;font-size:11.5px;color:var(--dim)}
.gone-h em{font-style:normal;font-weight:700;font-size:13.5px}
.gone-h u{text-decoration:none;color:var(--dim);font-size:12px}
.gone-h:active{background:var(--bg2)}
#gone-body{padding-top:9px;opacity:.85}
.wrow{padding:11px 12px;gap:9px}
/* pagalbos akordeonas */
.hsec{background:var(--card);border:1px solid var(--line);border-radius:12px;
  margin-bottom:8px;overflow:hidden}
.hsec-h{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  padding:13px 14px;background:none;border:0;color:var(--tx);cursor:pointer;
  font-family:inherit;font-size:14.5px;font-weight:600}
.hsec-h span{flex:1}
.hsec-h em{font-style:normal;font-size:17px;color:var(--dim);line-height:1}
.hsec-h:active{background:var(--bg2)}
.hsec-b{padding:0 14px 14px;font-size:13.5px;line-height:1.6;color:var(--dim)}
.hsec-b b{color:var(--tx)}
.hsec-b code{background:var(--bg2);border:1px solid var(--line);border-radius:5px;
  padding:1px 5px;font-size:12.5px}
/* atidarius vien pagalba grizimo mygtukas neturi kur vesti */
body.help-only #view-help .icon-btn.back{display:none}
/* ================= Ghost618 tema (variantas 2) =================
   Viena akcento spalva — smaragdas. Ji reiskia pelna IR veiksma, tad
   ekrane nera dvieju konkuruojanciu ryskiu spalvu. Raudona palikta tik
   nuostoliui: kai ji pasirodo, ji is tikruju kazka reiskia. */
:root{
  --bg:        #0b0d12;
  --bg2:       #161b25;
  --card:      #12161f;
  --line:      #1e2533;
  --tx:        #e9eef5;
  --dim:       #7a8596;
  --acc:       #38d39f;
  --up:        #38d39f;
  --dn:        #f2545b;
  --warn:      #e0a33e;
  --up-bg:     rgba(56,211,159,.14);
  --dn-bg:     rgba(242,84,91,.14);
  --warn-bg:   rgba(224,163,62,.14);
  --note-bg:   #1a1710;  --note-line: #33301c;
  --ok-bg:     #0d1a16;  --ok-line:   #17352b;
  --info-bg:   #0f1620;  --info-line: #1e2a38;
  --danger-bg: #1b1113;  --danger-line: #4a2126;
  --accent-tx: #38d39f;  --accent-bg: rgba(56,211,159,.12);
  --accent-line: rgba(56,211,159,.34);
  --r: 16px;
}

/* ---- saraso eilute: vardas + pinigai, po jais juostele ---- */
.wrow{flex-direction:column;align-items:stretch;gap:0;padding:13px 14px;border-radius:var(--r)}
.wrow-top{display:flex;align-items:baseline;gap:10px}
.wrow-top b{flex:1;min-width:0;font-size:15px;font-weight:600;line-height:1.3;
  white-space:normal;overflow-wrap:anywhere}
.wrow-net{font-size:16px;font-weight:650;white-space:nowrap;font-variant-numeric:tabular-nums}
.wrow-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:11.5px;color:var(--dim);font-variant-numeric:tabular-nums}
.wrow-meta .sep{opacity:.45}
/* ---- apatine navigacija ---- */
.tabbar{position:sticky;bottom:0;z-index:20;display:flex;
  background:var(--bg);border-top:1px solid var(--line);
  padding:7px 0 calc(7px + var(--sa-b,0px));margin-top:14px}
.tabbar button{flex:1;background:none;border:0;color:var(--dim);cursor:pointer;
  font-family:inherit;font-size:10.5px;display:flex;flex-direction:column;
  align-items:center;gap:3px;padding:2px 0}
.tabbar button b{font-size:19px;line-height:1;font-weight:400}
.tabbar button.on{color:var(--acc)}
#app{padding-bottom:0}
.view{padding-bottom:8px}
/* nustatymu eilutes */
.setrow{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  padding:14px;margin-bottom:8px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r);color:var(--tx);font-family:inherit;font-size:14.5px;
  cursor:pointer;text-decoration:none}
.setrow span{flex:1}
.setrow em{font-style:normal;color:var(--dim);font-size:13px}
.setrow u{text-decoration:none;color:var(--dim);font-size:17px;line-height:1}
.setrow:active{background:var(--bg2)}
/* pagalbos rezimu juosta nereikalinga */
body.help-only .tabbar{display:none}
/* ================= GYLIS =================
   Plokscias pavirsius nepasako, kas yra kortele, o kas fonas. Kiekvienas
   pavirsius cia gauna tris dalykus: sviesesni virsutini krasta (sviesa krinta
   is virsaus), svelnu vertikalu gradienta ir seseli po savimi. Seselis
   pastebimas tik pasamoningai — jei ji matai, jis per stiprus. */
:root{
  --edge:  inset 0 1px 0 rgba(255,255,255,.055);
  --lift:  0 1px 1px rgba(0,0,0,.32), 0 5px 14px -6px rgba(0,0,0,.6);
  --lift2: 0 2px 4px rgba(0,0,0,.34), 0 16px 34px -12px rgba(0,0,0,.7);
  --surface: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0) 62%);
}

.card,.wrow,.pos,.jrow,.gone-h,.subbar,.note,.setrow,.lk{
  background-image:var(--surface);
  box-shadow:var(--edge),var(--lift);
}
.hero{background-image:var(--surface);box-shadow:var(--edge),var(--lift2)}
/* paspaudimas turi bandyti pavirsiu zemyn — be to gylis nera tikras */
.wrow,.setrow,.gone-h,.jrow,.pos{transition:transform .11s ease, box-shadow .11s ease}
.wrow:active,.setrow:active,.gone-h:active{
  transform:translateY(1px);
  box-shadow:var(--edge),0 1px 2px rgba(0,0,0,.3);
}
/* mygtukai — tas pats principas, tik svelniau */
.btn,.icon-btn,.bell,.seg button{
  background-image:var(--surface);
  box-shadow:var(--edge),0 1px 2px rgba(0,0,0,.22);
}
.btn:active,.icon-btn:active,.bell:active,.seg button:active{
  transform:translateY(1px);box-shadow:none;
}
/* akcentiniai mygtukai kyla labiau ir meta savo spalvos seseli */
.btn.primary,.seg button.on{
  background-image:linear-gradient(180deg, rgba(255,255,255,.18), rgba(0,0,0,.06));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),
             0 1px 2px rgba(0,0,0,.3), 0 6px 16px -6px rgba(56,211,159,.55);
}
/* apatine juosta atsiskiria nuo turinio sesetiu i virsu, ne linija */
.tabbar{box-shadow:0 -10px 24px -14px rgba(0,0,0,.85)}
.sheet{box-shadow:0 -10px 40px rgba(0,0,0,.55)}
/* ================= saraso eilute: grafikas grazintas =================
   Juostele rode laimejimu dali, bet atrode kaip uzpildomas indas — pirma
   mintis buvo „tiek pinigu sukaupta". Skaicius su spalva to nesumaiso, o
   sesiu savaiciu kreive parodo, kaip tie pinigai uzdirbti. */
.wrow-meta{gap:7px;row-gap:6px}
.wrow-meta .wr-chip{font-size:11px;font-weight:700;min-width:0;padding:2px 7px;
  border-radius:7px;line-height:1.5;margin:0;flex:none}
.wrow-top{align-items:center}
.wrow-top .spark{width:58px;height:24px;flex:none;opacity:.9}
.wrow-meta .bell{width:30px;height:30px;font-size:13px}
@media (max-width:390px){ .wrow-top .spark{width:44px} }
/* Zymos gauna SAVO eilute su rezervuotu auksciu. Be rezervo pinigine su
   dviem zymemis buvo 109px, o be zymiu 82px, ir sarasas atrode nelygus —
   butent tai anksciau ir uzkliuvo. Dabar visos eilutes vienodos. */
.wrow-tags{display:flex;flex-wrap:wrap;gap:5px;min-height:17px;margin-top:6px}
.wrow-meta{flex-wrap:nowrap;margin-top:8px}
.wrow-meta > span:not(.wr-chip):not(.sep){white-space:nowrap}
/* eilute buvo 117px — matomos tik penkios. Suspaudziam iki ~105 nepaliesdami
   nei sriftu, nei tarpu tarp zodziu. */
.wrow{padding:12px 13px}
.wrow-meta{margin-top:7px}
.wrow-meta .bell{width:28px;height:28px;font-size:12.5px;border-radius:9px}
.wrow-tags{margin-top:5px}
   specifiskesne uz `.wrow`, todel gylio seselis buvo nustelbtas. Atkartojam
   ta pati specifiskuma. */
/* ROI kaip pagrindinis skaicius: „+237.1%" vienas galetu buti palaikytas
   laimejimu dalimi, todel salia lieka mazas uzrasas. */
.wrow-net i{font-style:normal;font-size:9.5px;font-weight:700;color:var(--dim);
  margin-left:3px;letter-spacing:.04em;vertical-align:1px}
/* ================= apatines juostos ikonos =================
   Po kiekviena ikona guli tamsesnis jos dvynys, pastumtas zemyn — is to
   gaunasi storis. Ikona nupiesta VIENA karta `<defs>`, o abu sluoksniai ja
   tik nurodo; spalvos i vidu keliauja per kintamuosius, nes CSS klases i
   `<use>` seseline medi nepatenka. */
:root{ --deep:#0a6b4f }

.tabbar button{position:relative}
.tabbar svg{width:24px;height:24px;display:block;overflow:visible;
  transition:transform .3s cubic-bezier(.34,1.6,.5,1)}
.tabbar .x{fill:currentColor}
.tabbar .det{fill:none;stroke:currentColor;stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round}
.tabbar .hole{fill:var(--bg)}
.tabbar .top .det{stroke:var(--bg)}
.tabbar .ext .x,.tabbar .ext .hole{fill:var(--deep)}
.tabbar .ext .det{stroke:var(--deep)}
.tabbar .ext{transform:translateY(3px);opacity:.6;
  transition:transform .3s cubic-bezier(.34,1.6,.5,1), opacity .3s}
.tabbar button.on svg{transform:translateY(-4px)}
.tabbar button.on .ext{transform:translateY(5px);opacity:1}
/* svytejimas uz aktyvios ikonos — silumos, o ne rembo */
.tabbar .gl{position:absolute;top:-1px;left:50%;width:36px;height:36px;margin-left:-18px;
  border-radius:50%;background:radial-gradient(circle,var(--acc),transparent 68%);
  opacity:0;transition:opacity .3s;pointer-events:none}
.tabbar button.on .gl{opacity:.2}
/* juostai reikia vietos storiui ir pakilimui, kitaip ikona nusikerpa */
.tabbar{padding-top:10px}
.tabbar button{gap:5px}
@media (prefers-reduced-motion: reduce){
  .tabbar svg,.tabbar .ext,.tabbar .gl{transition:none}
}
/* ---------- perejimo zymes ---------- */
.pill.jump{color:var(--accent-tx);background:var(--accent-bg);
  border-color:var(--accent-line);cursor:pointer;font-family:inherit;
  font-size:10.5px;padding:2px 7px;line-height:1.5}
.pill.jump:active{background:var(--acc);border-color:var(--acc);color:#fff}
.pos .top .grow{flex:1}
/* Ziedas parodo, KURI eilute atsivere naujame lange. Be jo nusileidi i
   sarasa ir vel ieskai akimis to paties, nuo ko atejai. */
@keyframes flash-ring{
  0%  {box-shadow:0 0 0 0 rgba(56,211,159,.6),var(--edge),var(--lift)}
  65% {box-shadow:0 0 0 8px rgba(56,211,159,0),var(--edge),var(--lift)}
  100%{box-shadow:var(--edge),var(--lift)}
}
.flash{animation:flash-ring 1.15s ease-out 2;border-color:var(--acc)!important}
@media (prefers-reduced-motion: reduce){
  .flash{animation:none;border-color:var(--acc)!important}
}

/* ================= prieinamumas =================
   Trys skoles, kurias parode auditas: taker zyme sviesioje temoje buvo
   2.18:1, klaviatura nepasakydavo, kur esi, o `prefers-reduced-motion`
   apeme tik dvi vietas is septyniu. */


/* baltas tekstas ant smaragdo yra 1.91:1 — imam tamsu, jis duoda ~8:1 */
.btn.primary,.seg button.on,.bell:active,.pill.jump:active{color:#04231a}

/* Klaviatura ir ekrano skaitytuvas turi matyti, kur esi. `:focus-visible`
   pasirodo tik naviguojant klaviatura, tad pelės paspaudimams netrukdo. */
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:6px}
.wrow:focus-visible,.setrow:focus-visible,.pos:focus-visible{outline-offset:-2px}

/* Visos animacijos, ne tik dvi. Svarbiausia — `.skl`: begalinis mirgesys,
   kuris zmogui su judesio jautrumu yra blogiausias is visu. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
  .skl{animation:none;background:var(--bg2)}
  .view.active,.sheet{animation:none}
}

/* „rodyti daugiau" po sandoriu sarasu */
.btn.wide{width:100%;margin:4px 0 10px}

/* ================= paleidimo ekranas =================
   Paveikslelis rodomas VISAS, nieko nenukerpant (`contain`). Plakatas yra
   gulscias (3:2), o telefonas stacias — `cover` butu palikes matoma vos
   ketvirtadali ploCio. Dabar sonai remiasi i ekrano krastus, o virsuje ir
   apacioje lieka juodos juostos. Fonas TIKSLIAI juodas, o ne temos spalva:
   sviesioje temoje juostos butu baltos ir plakatas atrodytu iskirptas.
   Gulsciame ekrane paveikslelis telpa visas. */
#splash{position:fixed;inset:0;z-index:100;overflow:hidden;
  display:flex;align-items:flex-end;justify-content:center;
  background:#000;
  transition:opacity .32s ease, visibility .32s}
#splash.gone{opacity:0;visibility:hidden;pointer-events:none}
#sp-img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:contain;object-position:center}

/* Zenklas rodomas tik tada, kai paveikslelio nera — tada jis stovi
   viduryje, o ne apacioje. */
#sp-mark{width:118px;height:118px;position:absolute;left:50%;top:42%;
  transform:translate(-50%,-50%)}
#sp-mark .sp-ring{fill:none;stroke:var(--line);stroke-width:5}
#sp-mark .sp-arc{fill:none;stroke:var(--acc);stroke-width:5;stroke-linecap:round;
  stroke-dasharray:47 141;transform-origin:50% 50%;animation:sp-spin 1.15s linear infinite}
#sp-mark .sp-line{fill:none;stroke:var(--acc);stroke-width:5;
  stroke-linecap:round;stroke-linejoin:round}
#sp-mark .sp-dot{fill:var(--acc)}
@keyframes sp-spin{to{transform:rotate(360deg)}}

.sp-foot{position:relative;z-index:2;width:100%;
  display:flex;flex-direction:column;align-items:center;gap:12px;
  padding:64px 20px calc(46px + var(--sa-b,0px));
  background:linear-gradient(to top,
    rgba(6,8,12,.94) 0%, rgba(6,8,12,.82) 42%, rgba(6,8,12,0) 100%)}
.sp-name{font-size:26px;font-weight:750;letter-spacing:-.02em;color:#fff;
  text-shadow:0 2px 14px rgba(0,0,0,.6)}
.sp-bar{width:168px;height:3px;border-radius:2px;
  background:rgba(255,255,255,.18);overflow:hidden}
.sp-bar i{display:block;width:38%;height:100%;border-radius:2px;background:var(--acc);
  animation:sp-slide 1.1s ease-in-out infinite}
@keyframes sp-slide{0%{transform:translateX(-110%)}100%{transform:translateX(360%)}}
.sp-txt{font-size:12px;color:rgba(255,255,255,.7);letter-spacing:.04em}

/* Kai pieSinys uzsikrove, jame pavadinimas paprastai jau yra — savo
   nebedubliuojam, o uzdanga lieka tik tiek, kad matytusi juosta. */
#splash.has-art .sp-name{display:none}
#splash.has-art .sp-foot{padding-top:34px;
  background:linear-gradient(to top,
    rgba(6,8,12,.72) 0%, rgba(6,8,12,.34) 50%, rgba(6,8,12,0) 100%)}

/* Judesio jautrumas: juosta sustoja, bet ekranas nelieka pakibes. */
@media (prefers-reduced-motion: reduce){
  .sp-bar i{animation:none;width:100%}
  #sp-mark .sp-arc{animation:none}
}

/* Apatine juosta yra `sticky` — ji NEUZIMA vietos sraute, tad paskutine
   saraso eilute galejo atsidurti po ja. Rezervuojam jos auksti. */
.view{padding-bottom:12px}
#app{padding-bottom:0}

/* ================= Desktop: telefono plocio stulpelis =================
   Telegram Desktop atidaro programele placiame lange, ir jo plocio botas
   nevaldo — patikrinta visais paleidimo keliais. Ka valdom — turini jame.
   720 px stulpelyje saraso eilutes issitempia ir atrodo tuscios; 460 px
   duoda ta pati vaizda kaip telefone.

   Ribojam pagal PLATFORMA, ne pagal plotį: iPad portretu irgi 768 px, o ten
   platesnis stulpelis veikia gerai. */
html[data-plat="tdesktop"] #app,
html[data-plat="macos"] #app,
html[data-plat="unigram"] #app,
html[data-plat="weba"] #app,
html[data-plat="webk"] #app{max-width:460px}

/* Modaliniai langai turi laikytis to paties plocio, kitaip jie issitemptu
   per visa juosta, o forma po jais butu siaura. */
html[data-plat="tdesktop"] .sheet,
html[data-plat="macos"] .sheet,
html[data-plat="unigram"] .sheet,
html[data-plat="weba"] .sheet,
html[data-plat="webk"] .sheet{max-width:460px}

/* `data-fit="left"` buvo skirtas 720 px stulpeliui, kai Telegram langas
   issikisdavo uz ekrano: centruotas turinys tada nukeliaudavo i nematoma
   dali. Su 460 px stulpeliu tos rizikos beveik nera — 460 telpa net ir
   smarkiai pastumtame lange — tad ji grazinam i vidurį. */
html[data-fit="left"][data-plat="tdesktop"] #app,
html[data-fit="left"][data-plat="macos"] #app,
html[data-fit="left"][data-plat="unigram"] #app,
html[data-fit="left"][data-plat="weba"] #app,
html[data-fit="left"][data-plat="webk"] #app{margin-left:auto;margin-right:auto}

/* ===== Desktop: juostos per visa plotį, turinys stulpelyje =====
   Susiaurinus stulpeli iki 460 px antraste ir apatine navigacija liko
   460 px plocio ir pakibo vidury tuscio lango. Fonas turi siekti krastus,
   o turinys — likti stulpelyje. `50% - 50vw` isplecia elementa uz tevo
   ribu, o vidinis uzpildas grazina turini i vieta. */
html[data-plat="tdesktop"] .hdr,
html[data-plat="macos"] .hdr,
html[data-plat="unigram"] .hdr,
html[data-plat="weba"] .hdr,
html[data-plat="webk"] .hdr,
html[data-plat="tdesktop"] .tabbar,
html[data-plat="macos"] .tabbar,
html[data-plat="unigram"] .tabbar,
html[data-plat="weba"] .tabbar,
html[data-plat="webk"] .tabbar{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  /* `max()` butinas: siaurame lange skirtumas tampa neigiamas, o neigiamas
     uzpildas negalioja — taisykle numetama ir tekstas prilimpa prie krasto. */
  padding-left:max(14px, calc(50vw - 230px + 14px));
  padding-right:max(14px, calc(50vw - 230px + 14px));
}

/* ===== apatine juosta visada apacioje =====
   `position:sticky` prispaudzia elementa prie krasto tik tada, kai yra ka
   slinkti. Kai turinio maziau nei lango — o taip buna zurnale, nustatymuose
   ir tuscioje pradzioje — juosta likdavo is karto po turiniu, kabodama
   vidury ekrano. Lankstus stulpelis isprendzia tai be jokiu matavimu:
   aktyvus langas uzima visa likusia vieta, juosta nustumiama zemyn. */
#app{display:flex;flex-direction:column;
  min-height:calc(var(--tg-vh,100dvh) - var(--sa-t,0px) - var(--sa-b,0px))}
.view{flex:0 0 auto}
.view.active{flex:1 0 auto}
.tabbar{margin-top:auto}

/* diagnostikos tekstas: monospace, kad skaiciai butu skaitomi ir kopijuojami */
.diag{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:11.5px;
  line-height:1.55;color:var(--tx);background:var(--bg2);border:1px solid var(--line);
  border-radius:11px;padding:11px 12px;margin:0 0 10px;white-space:pre-wrap;
  overflow-x:auto;max-height:46vh}

/* ================= programeles karkasas =================
   `sticky` juosta reikalauja turinio PO savimi — o jo nera, todel juosta
   pasirodydavo tik nuslinkus i pacia apacia. Cia `body` nebeslenka visai:
   slenka vidurine dalis, o juosta yra jos brolis ir todel visada apacioje.

   Veikia be jokiu Telegram skaiciu: uztenka, kad `#app` butu tokio aukscio,
   kaip jam skirta vieta. */
html[data-shell] body{overflow:hidden}
html[data-shell] #app{height:calc(var(--tg-vh,100dvh) - var(--sa-t,0px) - var(--sa-b,0px));
  min-height:0;padding-bottom:0}
html[data-shell] .view{min-height:0}
html[data-shell] .view.active{flex:1 1 auto;overflow-y:auto;overflow-x:hidden;
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain}
html[data-shell] .tabbar{position:static;flex:0 0 auto;margin-top:0}
/* antraste lipa prie slenkancios dalies virsaus, ne prie lango */
html[data-shell] .hdr{position:sticky;top:0}

/* ===== apatine saugi zona skaiciuojama VIENA karta =====
   `body` ja dedavo kaip uzpilda IR juosta dedavo ja savyje. Rezultatas:
   juosta pakelta 47 px nuo fizinio krasto, o po ja — tuscia fono juostele.
   Butent tai ir atrode kaip „juosta ne prie krasto".

   Teisingai: `body` apacios nebededa, juostos FONAS siekia fizini krasta,
   o piktogramos lieka virs gestu juosteles per pacios juostos uzpilda. */
html[data-shell] body{padding-bottom:0}
html[data-shell] #app{height:calc(var(--tg-vh,100dvh) - var(--sa-t,0px))}

/* pinigines amziaus zyme: ne ispejimas, o faktas apie prekiautoja */
.pill.hist{color:var(--warn);border-color:var(--warn-bg);background:var(--warn-bg)}
.hist-note{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:11.5px;margin:-4px 0 10px}
.hist-note:empty{display:none}

/* ===== zurnalas: uzdaryti sandoriai pagal pinigine =====
   Plokscias sarasas po keliu menesiu virsta simtu eiluciu, kuriose nieko
   nerasi. Viena eilute vienai piniginei su bendra suma; detales — paspaudus. */
.jgrp{margin-bottom:9px}
.jgrp-h{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  padding:11px 13px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r);color:var(--tx);cursor:pointer;font-family:inherit;
  background-image:var(--surface);box-shadow:var(--edge),var(--lift);
  transition:transform .11s ease, box-shadow .11s ease}
.jgrp-h:active{transform:translateY(1px);box-shadow:var(--edge),0 1px 2px rgba(0,0,0,.3)}
.jgrp-h u{text-decoration:none;color:var(--dim);font-size:12px;flex:none;width:12px}
.jgrp-h span{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.jgrp-h b{font-size:14px;font-weight:650;overflow-wrap:anywhere}
.jgrp-h i{font-style:normal;font-size:11.5px;color:var(--dim)}
.jgrp-h em{font-style:normal;font-weight:700;font-size:14.5px;white-space:nowrap;
  font-variant-numeric:tabular-nums}
.jgrp-b{padding:9px 0 2px}
.jgrp-b .jrow{margin-left:10px}

/* Veiksmo etikete — ta pati spalva kaip taskelis kaireje; ji nustatoma
   `style` atributu, nes palete gyvena JS pusėje kartu su grafiku.
   Pilnas isejimas dar ir paryskinamas: tai svarbiausias sandorio momentas. */
.f .fk{font-weight:500}
.f .out{font-weight:700}

/* Asmeniniu sandoriu suvestine: ta pati eilute kaip grupes antraste, tik be
   isskleidimo — spausti nera ko, sarasas ir taip atviras. */
.jgrp-h.as-sum{cursor:default;margin-bottom:8px}

/* Dienos skiltis guli PINIGINES viduje, tad ji seklesne: be fono, mazesnis
   sriftas ir bruksnys is kaires. Kitaip du vienodi sluoksniai susilietu ir
   nesimatytu, kas kam priklauso. */
.jday-h{background:transparent;border:0;border-top:1px solid var(--line);
  border-radius:0;padding:9px 4px;font-size:13px}
.jday:first-child .jday-h{border-top:0}
.jday-b{padding-left:10px;border-left:2px solid var(--line);margin:0 0 6px 4px}

/* Paieskos laukelis virs skilciu: jis veikia PRO jas, tad ir stovi auksciau. */
.jsearch{position:relative;margin:0 0 8px}
.jsearch input{width:100%;padding:10px 34px 10px 13px;border-radius:11px;
  border:1px solid var(--line);background:var(--card);color:var(--fg);
  font-size:14px;font-family:inherit}
.jsearch input:focus{outline:none;border-color:var(--acc)}
.jsearch button{position:absolute;right:6px;top:50%;transform:translateY(-50%);
  border:0;background:transparent;color:var(--dim);font-size:15px;
  cursor:pointer;padding:6px 8px;line-height:1}

/* Legendos zenklai — tokie patys kaip grafike. */
#c-legend .lg{font-size:13px;line-height:1;margin-right:4px;font-style:normal}
#c-legend .lgp{font-size:9px;vertical-align:super;font-style:normal}
#c-legend .lg-note{color:var(--dim);font-size:11px;flex-basis:100%;margin-top:2px}
