:root{
  --bg:#0f1416; --card:#171d1f; --card2:#1d2426; --ink:#eef1f0; --mut:#8b9794;
  --line:#252d2f; --acc:#b9ff5a; --ok:#5dd39e; --warn:#ffc857; --bad:#ff7a5c;
  --radius:16px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);
  font:15px/1.45 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  overscroll-behavior-y:contain}
.app{max-width:560px;margin:0 auto;padding:0 14px calc(84px + env(safe-area-inset-bottom))}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 2px 12px;background:linear-gradient(var(--bg) 72%,rgba(15,20,22,.86))}
.mark{font-weight:800;letter-spacing:-.03em;font-size:17px}
.mark span{letter-spacing:-.12em}
.who{display:block;font-size:11.5px;color:var(--mut);letter-spacing:.02em;margin-top:1px}
.top-right{display:flex;align-items:center;gap:8px}
.stamp{font-size:11.5px;color:var(--mut);white-space:nowrap}
.icon-btn{width:40px;height:40px;border-radius:11px;border:1px solid var(--line);background:var(--card);
  color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0;transition:.15s}
.icon-btn svg{width:18px;height:18px}
.icon-btn:active{transform:scale(.94)}
.icon-btn.spin svg{animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

h1{font-size:22px;margin:6px 0 2px;letter-spacing:-.03em}
h2{font-size:16px;margin:0 0 10px;letter-spacing:-.01em}
.sub{color:var(--mut);font-size:13px;margin:0 0 16px}
.block{margin:0 0 18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:15px 16px}
.card + .card{margin-top:10px}
.card.acc{border-color:rgba(185,255,90,.35)}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.muted{color:var(--mut)}
.small{font-size:12.5px}
.tiny{font-size:11.5px;color:var(--mut)}

.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:13px 14px}
.kpi b{display:block;font-size:26px;line-height:1.05;letter-spacing:-.03em;margin-bottom:2px}
.kpi span{font-size:12.5px;color:var(--mut)}
.kpi .delta{font-size:12px;font-weight:700;margin-top:5px;display:inline-block}
.up{color:var(--ok)} .down{color:var(--bad)} .flat{color:var(--mut)}

.list{display:grid;gap:9px}
.item{background:var(--card2);border:1px solid var(--line);border-radius:13px;padding:11px 13px}
.item .t{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.item .name{font-weight:600;font-size:14px}
.item .time{font-size:11.5px;color:var(--mut);white-space:nowrap}
.item .txt{font-size:13px;color:#c9d1cf;margin-top:4px;overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.item .meta{font-size:11.5px;color:var(--mut);margin-top:6px}
.tag{display:inline-block;font-size:11px;padding:2.5px 8px;border-radius:99px;border:1px solid var(--line);
  color:var(--mut);background:rgba(255,255,255,.02)}
.tag.bad{color:var(--bad);border-color:rgba(255,122,92,.4)}
.tag.warn{color:var(--warn);border-color:rgba(255,200,87,.4)}
.tag.ok{color:var(--ok);border-color:rgba(93,211,158,.4)}
.actions{display:flex;gap:8px;margin-top:9px;flex-wrap:wrap}
.btn{font:inherit;font-size:13px;font-weight:600;border-radius:10px;padding:8px 12px;cursor:pointer;
  border:1px solid var(--line);background:var(--card);color:var(--ink);text-decoration:none;display:inline-flex;
  align-items:center;gap:6px}
.btn.acc{background:var(--acc);color:#101415;border-color:var(--acc)}
.btn:active{transform:scale(.97)}

.bars{display:grid;gap:9px}
.bar-row{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:13px}
.bar{height:7px;border-radius:99px;background:#222a2c;overflow:hidden;grid-column:1/-1}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),#7fd93a)}
.funnel{display:grid;gap:6px}
.fn{display:flex;align-items:center;gap:10px}
.fn .n{width:38px;text-align:right;font-weight:800;font-size:17px}
.fn .l{font-size:13px;color:var(--mut)}
.fn .p{flex:1;height:8px;border-radius:99px;background:#222a2c;overflow:hidden}
.fn .p i{display:block;height:100%;background:var(--acc);opacity:.85}

.tabs{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:repeat(5,1fr);
  gap:2px;padding:7px 8px calc(7px + env(safe-area-inset-bottom));background:rgba(18,23,25,.96);
  border-top:1px solid var(--line);backdrop-filter:blur(12px)}
.tab{position:relative;background:none;border:0;color:var(--mut);font:inherit;font-size:10.5px;font-weight:600;
  display:grid;justify-items:center;gap:4px;padding:9px 2px;min-height:46px;cursor:pointer;border-radius:12px}
.tab svg{width:21px;height:21px}
.tab.active{color:var(--acc)}
.tab .badge{position:absolute;top:2px;right:calc(50% - 20px);min-width:16px;height:16px;border-radius:99px;
  background:var(--bad);color:#fff;font-size:10px;font-weight:800;display:none;place-items:center;padding:0 4px}
.tab .badge.on{display:grid}

.skeleton-wrap{display:grid;gap:11px;padding-top:8px}
.sk{height:76px;border-radius:var(--radius);background:linear-gradient(100deg,#171d1f 30%,#1e2628 50%,#171d1f 70%);
  background-size:220% 100%;animation:sh 1.2s infinite}
.sk-lg{height:120px}.sk-sm{height:52px}
@keyframes sh{to{background-position:-120% 0}}
.err{background:#241a18;border:1px solid rgba(255,122,92,.35);color:#ffd9d0;border-radius:var(--radius);
  padding:14px;font-size:13.5px}
.note{background:rgba(255,200,87,.08);border:1px solid rgba(255,200,87,.28);color:#ffe6b0;
  border-radius:13px;padding:11px 13px;font-size:12.5px;line-height:1.45}
.note b{color:#fff}

/* ── заработок (v2, 22.09.2026) ── */
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:var(--card);border:1px solid var(--line);
  border-radius:13px;padding:5px;margin:0 0 14px}
.seg button{font:inherit;font-size:12.5px;font-weight:700;color:var(--mut);background:none;border:0;padding:9px 4px;
  border-radius:9px;cursor:pointer}
.seg button.on{background:var(--acc);color:#101415}
.mform{display:grid;gap:9px}
.frow{display:grid;grid-template-columns:1fr 108px;gap:10px;align-items:center}
.frow label{font-size:12.5px;color:var(--mut)}
.inp{font:inherit;font-size:14px;color:var(--ink);background:var(--card2);border:1px solid var(--line);
  border-radius:10px;padding:9px 11px;width:100%;-webkit-appearance:none;appearance:none;min-width:0}
.inp:focus{outline:none;border-color:rgba(185,255,90,.55)}
.xbtn{background:none;border:0;color:var(--bad);font:inherit;font-size:13px;cursor:pointer;padding:2px 6px}
.tag.done{} .tag.ok{color:var(--ok);border-color:rgba(93,211,158,.4)}

/* ── авито: график, выбор объявления, рекомендации (23.09.2026) ── */
.chart{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 12px 10px}
.chart svg{width:100%;height:auto;display:block}
.legend{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:11.5px;color:var(--mut);margin-top:9px}
.legend span{display:inline-flex;align-items:center;gap:5px}
.sw{width:9px;height:9px;border-radius:3px;display:inline-block}
.sw.acc{background:var(--acc)} .sw.ok{background:var(--ok)}
.item.act{border-color:rgba(185,255,90,.5);background:#1f2624}
.item[data-avitem],.item[data-avopen]{cursor:pointer}
.act-note{margin-top:7px;font-size:12px;line-height:1.4;color:#ffe6b0;background:rgba(255,200,87,.08);
  border:1px solid rgba(255,200,87,.28);border-radius:10px;padding:7px 9px}