:root{
  --bg:#0f1115; --bg2:#13161c; --panel:#171a21; --line:#262b36; --line2:#1f2430; --ctl:#2e3440;
  --text:#e6e8ec; --mut:#8b93a3; --dim:#7d8594; --accent:#4f9cf0; --pri:#2b5f9e; --pri-b:#3b76bf;
  --ok:#5cc98f; --warn:#e8c36a; --bad:#f07a73;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  color-scheme:dark;   /* тёмные полосы прокрутки и системные элементы форм */
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:13px;line-height:1.4}
a{color:#9db9d9;text-decoration:none}a:hover{color:#fff}
[hidden]{display:none!important}
h1{font-size:18px;font-weight:600;margin:0}
h2{font-size:13px;font-weight:600;margin:0;color:#c3c8d2;text-transform:uppercase;letter-spacing:.06em}

.nav{display:flex;align-items:center;gap:20px;padding:0 24px;min-height:48px;border-bottom:1px solid var(--line);background:var(--bg2);flex-wrap:wrap;position:sticky;top:0;z-index:5}
.brand{font-weight:600;letter-spacing:.08em;color:#fff}
.nav a{color:var(--mut);padding:14px 0}
.nav a.on{color:#fff;box-shadow:inset 0 -2px 0 var(--accent)}
.nav .right{margin-left:auto;display:flex;gap:10px;align-items:center}

.wrap{max-width:1280px;margin:0 auto;padding:20px 24px 48px;display:flex;flex-direction:column;gap:16px}
.head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.spacer{margin-left:auto}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.col{display:flex;flex-direction:column;gap:12px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px}
.pad{padding:16px}
.scroll{overflow-x:auto}

.btn{background:#1d2129;border:1px solid var(--ctl);color:var(--text);border-radius:6px;padding:7px 12px;font:inherit;cursor:pointer;min-height:36px;white-space:nowrap}
.btn:hover{border-color:#465066}
.btn:disabled{opacity:.5;cursor:default}
.btn.pri{background:var(--pri);border-color:var(--pri-b);color:#fff}
.btn.go{background:#1f6b45;border-color:#2a8a5a;color:#fff}
.btn.stop{background:#5c1f1b;border-color:#8a2f29;color:#fff;font-weight:600}
.btn.dan{border-color:#6b2f2c;color:var(--bad)}
.btn.sm{padding:4px 9px;min-height:28px;font-size:12px}

.seg{display:inline-flex;border:1px solid var(--ctl);border-radius:6px;overflow:hidden}
.seg button{background:var(--panel);border:0;color:var(--mut);padding:5px 10px;font:inherit;font-size:12px;cursor:pointer;min-height:30px}
.seg button.on{background:var(--pri);color:#fff}

.field{display:flex;flex-direction:column;gap:4px}
.field>span{color:var(--mut);font-size:11px}
.inp{background:var(--bg);border:1px solid var(--ctl);border-radius:6px;color:var(--text);padding:7px 10px;font:inherit;min-height:36px;min-width:0}
.inp:focus{outline:none;border-color:var(--accent)}
.inp.mono,textarea.inp{font-family:var(--mono);font-size:12px}
.inp.w60{width:60px}.inp.w80{width:80px}.inp.w110{width:110px}.inp.w160{width:160px}.inp.w240{width:240px}.inp.w360{width:360px}
textarea.inp{width:100%;line-height:1.5;resize:vertical;white-space:pre;tab-size:2}
label.chk{display:flex;gap:8px;align-items:center;min-height:36px}

table{width:100%;border-collapse:collapse}
th{font-weight:500;color:var(--mut);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);font-size:12px;white-space:nowrap}
td{padding:8px 10px;border-bottom:1px solid var(--line2);vertical-align:middle;white-space:nowrap}
tr:last-child td{border-bottom:0}
tr.click{cursor:pointer}tr.click:hover td{background:#1b1f28}
tr.sel td{background:#172235}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right}
td.wrapcell{white-space:normal;min-width:220px}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.src{color:var(--dim);font-size:11px}
.ok{color:var(--ok)}.warn{color:var(--warn)}.bad{color:var(--bad)}.mut{color:var(--mut)}
.hint{color:var(--dim);font-size:11px;line-height:1.45}
.empty{padding:22px;text-align:center;color:var(--mut)}

.chip{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:500;border:1px solid transparent}
.c-auto,.c-ok{background:#163b2b;color:#6fd3a0;border-color:#1f5a40}
.c-alarm{background:#3b3116;color:#e8c36a;border-color:#5a4a1f}
.c-watch,.c-new{background:#1b2a3f;color:#8fbcf0;border-color:#27446a}
.c-off{background:#22262e;color:var(--dim);border-color:var(--ctl)}
.c-ban{background:#3d1f1d;color:var(--bad);border-color:#5c2c29}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle;background:#6b7280}
.dot.ok{background:var(--ok)}.dot.warn{background:var(--warn)}.dot.bad{background:var(--bad)}

.status{display:flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:8px;background:var(--panel);overflow:hidden}
.status .s{flex:1 1 150px;padding:12px 16px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.status .s:last-child{border-right:0}
.status .l{color:var(--mut);font-size:11px}
.status .v{font-family:var(--mono);font-size:19px;font-weight:500}
.status .d{font-size:11px;color:var(--dim)}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.card .t{display:flex;align-items:center;gap:8px}
.card .n{font-weight:600;font-size:15px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:12px}
.kv .k{color:var(--mut)}
.att .i{display:flex;gap:12px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line2);flex-wrap:wrap}
.att .i:last-child{border-bottom:0}
.acts{display:flex;gap:4px;flex-wrap:wrap}
.acts.tight{display:inline-flex;flex-wrap:nowrap}
.log{font-family:var(--mono);font-size:12px;display:flex;flex-direction:column;gap:5px;padding:12px 14px}
.banner{background:#3b3116;border:1px solid #5a4a1f;color:var(--warn);border-radius:8px;padding:10px 14px}
.banner.info{background:#1b2a3f;border-color:#27446a;color:#8fbcf0}
.bar{display:inline-block;height:6px;border-radius:3px;background:var(--line);width:80px;vertical-align:middle;margin-right:8px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--ok)}
pre.out{background:#0b0d11;border:1px solid var(--ctl);border-radius:6px;padding:10px 12px;font-family:var(--mono);font-size:12px;line-height:1.5;overflow:auto;max-height:50vh;margin:0;white-space:pre-wrap;word-break:break-word}

/* Монеты: свой цвет у каждой, мощность — только в своей единице */
.ctag{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.ctag i{display:inline-block;width:9px;height:9px;border-radius:3px;flex:0 0 auto}
.cbar{display:inline-block;width:56px;height:5px;border-radius:3px;background:var(--line);overflow:hidden;vertical-align:middle;margin:0 6px}
.cbar.wide{width:120px;margin-left:0}
.cbar i{display:block;height:100%}
.cards.coins{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.coinsum{cursor:pointer;text-align:left;color:inherit;font:inherit;gap:8px}
.coinsum:hover{border-color:#465066}
.coinsum.on{border-color:var(--c);background:#151b26}
.coinsum .t{display:flex;align-items:center;gap:8px;width:100%}
.coinsum .pw{display:flex;align-items:baseline;gap:6px}
.coinsum .big{font-family:var(--mono);font-size:24px;font-weight:500;color:var(--c);line-height:1.1}
.coinsum .u{color:var(--mut);font-size:13px}
.coinsum .row2{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
tr.grp td{background:var(--bg2);padding:7px 10px;border-bottom:1px solid var(--line)}

/* ---------- Рынок ---------- */
.wrap.wide{max-width:1520px}
.banner.good{background:#12261c;border-color:#1f5a40;color:#8fdcb3}
.banner.bad{background:#2a1716;border-color:#5c2c29;color:#f3a29c}
.lnk{background:none;border:0;color:#8fb0d8;font:inherit;cursor:pointer;padding:6px 6px;min-height:32px}
.lnk:hover{color:#fff}.lnk.dan{color:var(--bad)}
.tabs.mkp button{display:inline-flex;gap:7px;align-items:center}
.tabs .n{font-family:var(--mono);font-size:11px;color:var(--dim);background:#1d2129;border-radius:999px;padding:1px 7px}
.mkbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.mkbar .search{display:flex;align-items:center;gap:8px;flex:1 1 300px;min-height:38px;padding:0 12px;background:var(--bg);border:1px solid var(--ctl);border-radius:8px;color:var(--dim)}
.mkbar .search:focus-within{border-color:var(--accent)}
.mkbar .search input{flex:1;background:none;border:0;outline:0;color:var(--text);font:inherit;min-width:0;min-height:36px}
.mkbar .lens{display:flex;align-items:center;gap:8px;color:var(--mut)}
.pills{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pill{display:inline-flex;align-items:center;min-height:32px;border:1px solid #2f4a70;background:#16202f;border-radius:999px;white-space:nowrap;overflow:hidden}
.pill button{background:none;border:0;color:var(--text);font:inherit;cursor:pointer;min-height:32px;padding:0 4px 0 12px}
.pill .k{color:#8fb0d8}
.pill .x{padding:0 10px 0 6px;color:var(--mut);font-size:15px}
.pill .x:hover{color:#fff}
button.pill.add{border-style:dashed;border-color:#3a4252;background:transparent;color:#c3c8d2;padding:0 14px;cursor:pointer;font:inherit}
button.pill.add.open{border-style:solid;border-color:var(--accent);color:#fff;background:#16202f}
.mkmenu{display:flex;background:#1b1f28;border:1px solid #39414f;border-radius:12px;overflow:hidden}
.mkmenu .left{flex:0 0 440px;border-right:1px solid var(--ctl);padding:10px 12px 14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 10px;align-content:start}
.mkmenu h3{margin:8px 0 2px 8px;font-size:11px;font-weight:600;color:var(--mut);text-transform:uppercase;letter-spacing:.06em}
.mkmenu .fi{display:flex;justify-content:space-between;gap:10px;align-items:center;width:100%;background:none;border:0;color:var(--text);font:inherit;text-align:left;padding:5px 8px;border-radius:6px;cursor:pointer;min-height:30px}
.mkmenu .fi:hover{background:#232936}
.mkmenu .fi .v{color:#8fbcf0;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
.mkmenu .fi.cur{background:#243248;color:#fff}
.mkmenu .right{flex:1;min-width:0;padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.mkmenu .ttl{font-size:15px}
.mkmenu .back{display:none;text-align:left;padding-left:0}
.mkmenu .pick{padding:20px 0}
.mkmenu .foot{display:flex;align-items:center;gap:10px;margin-top:auto;border-top:1px solid var(--ctl);padding-top:12px;flex-wrap:wrap}
.opts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.opt{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--ctl);background:var(--panel);color:#c3c8d2;font:inherit;cursor:pointer}
.opt.sm{min-height:28px;padding:0 10px;font-size:12px}
.opt.on{border-color:var(--pri-b);background:#16202f;color:#fff}
.chklist{display:flex;flex-direction:column;max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:8px;padding:4px 10px}
.chklist.cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:0 14px}
.chklist label.chk{justify-content:space-between;min-height:30px;gap:8px}
.chklist .c{font-family:var(--mono);font-size:11px;color:var(--dim)}
.mkstat{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.mkstat b{font-family:var(--mono);font-weight:500;font-size:15px;display:block}
.mkstat b small{font-size:12px;font-weight:400}
.mkstat .l{color:var(--mut);font-size:11px;display:block}
.mkstat .note{max-width:420px}
table.mkt td{padding:9px 8px}
table.mkt th{padding:9px 8px}
table.mkt td:first-child,table.mkt th:first-child{padding-right:2px}
th.srt{cursor:pointer;user-select:none}
th.srt:hover{color:#fff}
tr.dim td{opacity:.6}
tr.sub td{background:#131b28;font-size:12px;padding:6px 9px}
.cc{font-family:var(--mono);font-size:10px;padding:1px 5px;border:1px solid var(--ctl);border-radius:4px;color:#aab2c0;margin-left:6px}
.tagl{display:block;font-size:11px;margin-top:2px;white-space:normal}
td.cardsc{white-space:normal;min-width:150px;max-width:300px}
.plbar{display:inline-block;width:40px;height:4px;border-radius:2px;background:var(--line);overflow:hidden;vertical-align:middle;margin-right:7px}
.plbar.wide{width:70px;margin:0 8px}
.plbar i{display:block;height:100%;background:#6b7688}
.plbar i.low{background:var(--warn)}
.cchips{display:inline-flex;gap:8px;margin-left:6px}
.cchip{display:inline-flex;align-items:center;gap:4px;font-family:var(--mono);font-size:11px;color:#aab2c0}
.cchip i{display:inline-block;width:7px;height:7px;border-radius:2px}
.hostc{white-space:normal;min-width:140px;max-width:200px;font-size:12px}
.exp{background:none;border:0;color:var(--mut);cursor:pointer;width:28px;height:28px}
.basket{position:sticky;bottom:0;margin:0 -24px -48px;padding:12px 24px;background:#141c2a;border-top:1px solid var(--pri);z-index:4}
.basket .in{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.mkcards{display:flex;flex-direction:column;gap:10px}
.mkcard{display:flex;flex-direction:column;gap:9px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;color:inherit;font:inherit;text-align:left;cursor:pointer;font-size:14px}
.mkcard.dim{opacity:.6}
.mkcard .r1,.mkcard .r3{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.mkcard .price{font-family:var(--mono);font-size:19px;font-weight:500}
.mkcard .facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 10px}
.mkcard .facts .l{display:block;color:var(--mut);font-size:12px}
.mkcard .r3{border-top:1px solid var(--line);padding-top:9px;align-items:center}
.mkserver{display:flex;flex-direction:column;gap:12px}
.mkserver .big{font-size:17px}
.mkserver .pricebig{font-family:var(--mono);font-size:26px;font-weight:500;line-height:1}
.mkserver .sect{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:12px}
.mkserver .kv{grid-template-columns:170px 1fr;gap:7px 14px;font-size:13px}
.mkserver .sum{display:grid;grid-template-columns:1fr auto;gap:4px 16px;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.payopt{display:inline-flex;align-items:center;gap:8px;padding:0 12px;border:1px solid var(--ctl);border-radius:8px;min-height:38px;cursor:pointer}
.payopt.on{border-color:var(--pri-b);background:#141d2b}
.payopt.off{color:var(--dim);cursor:default}
.btn.take{border-color:var(--accent);color:#fff;font-weight:500;min-height:42px;padding:8px 16px}

.side{flex:0 1 220px;min-width:180px;display:flex;flex-direction:column;gap:6px}
.main{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:14px}
.rc{padding:9px 12px;border:1px solid var(--line);border-radius:6px;background:var(--bg2);display:flex;flex-direction:column;gap:2px;cursor:pointer;text-align:left;color:inherit;font:inherit}
.rc.on{border-color:var(--pri-b);background:#172235}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.tabs button{background:transparent;border:0;color:var(--mut);padding:8px 12px;font:inherit;cursor:pointer;min-height:36px}
.tabs button.on{color:#fff;box-shadow:inset 0 -2px 0 var(--accent)}

.login{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg)}
.login .panel{width:300px}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px;z-index:20;overflow:auto}
.modal .panel{width:min(760px,100%)}
/* окно, которое тянут за правый нижний угол: список внутри растёт вместе с ним */
.modal .panel.resizable{resize:both;overflow:auto;width:min(920px,100%);min-width:min(460px,100%);min-height:340px;max-width:calc(100vw - 32px)}
.calibwin .chklist.calib{flex:1 1 300px;max-height:none;min-height:150px}
.hid{display:none!important}
.wk{font-size:12px;color:var(--mut);white-space:nowrap;margin-top:2px}.wk .mono{color:var(--text);user-select:all}
.pricenow{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.pricenow .l{color:var(--mut)}.pricenow strong{font-size:16px}
.calcbox{line-height:1.7;border-left:2px solid var(--ctl);padding-left:10px}
/* Настройки монеты: таблица моделей — рабочая, с восемью колонками, ей нужно больше места,
   чем форме слева. Заголовки переносятся, поля узкие, «откуда цифра» — мелко под моделью;
   если экран всё же узок, таблица листается внутри своей панели, а не вылезает за неё. */
@media (min-width:861px){.grid2.coined{grid-template-columns:minmax(0,5fr) minmax(0,8fr)}}
table.hrt th{white-space:normal;line-height:1.25;padding:6px 6px;vertical-align:bottom}
table.hrt td{padding:6px 6px}
table.hrt .inp.w160{width:150px}
.hrsrc{margin-top:3px;white-space:normal;max-width:190px;line-height:1.3}
/* окупаемость аренды во «Флоте» */
.pay{display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap}
.tagp{font-size:11px;padding:1px 6px;border-radius:4px;border:1px solid var(--ctl);color:var(--mut)}
.tagp.ok{border-color:#1f5a40;color:var(--ok)}.tagp.bad{border-color:#5c2c29;color:var(--bad)}
.coinsum .money{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--mut)}
.toast{position:fixed;bottom:76px;left:50%;transform:translateX(-50%);background:#22262e;border:1px solid var(--ctl);border-radius:8px;padding:10px 16px;z-index:30;max-width:90vw}
.toast.bad{border-color:#6b2f2c;color:var(--bad)}.toast.ok{border-color:#1f5a40;color:var(--ok)}

/* Просто / Подробно */
body:not(.adv) .adv-only{display:none}

@media (max-width:860px){
  .grid2{grid-template-columns:1fr}
  .nav{gap:16px;padding:0 14px;flex-wrap:nowrap;overflow-x:auto}   /* меню в одну строку, листается пальцем */
  .nav a,.nav .brand{white-space:nowrap;flex:0 0 auto}
  .nav .right{flex:0 0 auto}
  .wrap{padding:14px 14px 40px}
  .status .v{font-size:17px}
  .basket{margin:0 -14px -40px;padding:10px 14px}
}
/* Рынок на телефоне: меню фильтров во весь экран, сначала список, потом настройка одного фильтра */
@media (max-width:760px){
  .mkmenu{position:fixed;inset:0;z-index:15;border-radius:0;border:0;flex-direction:column;overflow:auto}
  .mkmenu .left{flex:0 0 auto;border-right:0;grid-template-columns:1fr;padding:12px 14px}
  .mkmenu .fi{min-height:44px;font-size:15px}
  .mkmenu.has-cur .left{display:none}
  .mkmenu:not(.has-cur) .right .pick{display:none}
  .mkmenu .right{padding:14px}
  .mkmenu .back{display:block;min-height:44px}
  .mkmenu .foot{position:sticky;bottom:0;background:#1b1f28;padding-bottom:12px}
  .opt{min-height:44px}
  .pill,.pill button,button.pill.add{min-height:40px}
  .tabs.mkp{flex-wrap:nowrap;overflow-x:auto}
  .tabs.mkp button{flex:0 0 auto;min-height:44px}
  #mk-meta{order:5;flex:1 1 100%;font-size:12px}
  .mkstat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px}
  .mkstat b{font-size:13px}
  .mkstat>span:nth-child(3){grid-column:1 / -1}
  .mkbar label.chk{min-height:44px;flex:0 0 auto}
  .mkbar .lens .lbl{display:none}
  .pills{flex-wrap:nowrap;overflow-x:auto;padding-bottom:2px}
  .pills>*{flex:0 0 auto}
  .mkbar{gap:8px}
  .mkbar .lens{flex:1 1 auto;justify-content:space-between}
  .mkbar .lens select{min-height:44px}
  .mkbar .search{flex:1 1 100%;min-height:44px}
  #mk-view{display:flex;flex:1 1 100%}
  #mk-view button{flex:1;min-height:40px}
  .mkstat .note{display:none}
  .mkserver .kv{grid-template-columns:1fr}
  .mkserver .kv .k{margin-top:6px}
  .btn.take{flex:1 1 100%;min-height:48px}
  .mkserver .row .btn{min-height:44px}
}