:root{
  --bg:#f6f7f9; --surface:#fff; --surface-2:#fbfbfc; --border:#e3e5e9; --border-2:#c9ccd3;
  --text:#14161a; --mut:#6b7280; --accent:#2563eb;
  --ok:#059669; --warn:#b45309; --stop:#b91c1c;
  --ok-bg:#ecfdf5; --warn-bg:#fffbeb; --stop-bg:#fef2f2;
  --radius:10px; --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#0e1013; --surface:#16191e; --surface-2:#1b1f25; --border:#272c34; --border-2:#3a414b;
  --text:#e8eaed; --mut:#9aa3af; --accent:#60a5fa;
  --ok:#34d399; --warn:#fbbf24; --stop:#f87171;
  --ok-bg:#06281d; --warn-bg:#2a1f05; --stop-bg:#2a1010;
}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);
  font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
h1,h2,h3{margin:0 0 .5rem}
h2{font-size:1.05rem;margin-top:1.4rem}
h3{font-size:.95rem}
.mut{color:var(--mut)}
code{font-family:var(--mono);font-size:.85em;background:var(--surface-2);padding:.1em .35em;border-radius:4px}

/* вход */
.gate{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);z-index:50}
.gate-box{background:var(--surface);border:1px solid var(--border);border-radius:14px;
  padding:1.6rem 1.8rem;width:min(400px,92vw)}
.gate-box label{display:block;margin:.8rem 0 0;font-size:.85rem;color:var(--mut)}
.gate-box input{width:100%;margin-top:.25rem}
.gate-box button{width:100%;margin-top:1.1rem}
.err{color:var(--stop);margin-top:.6rem;font-size:.85rem;min-height:1.2em}

/* каркас */
header{position:sticky;top:0;z-index:20;display:flex;gap:1rem;align-items:center;
  background:var(--surface);border-bottom:1px solid var(--border);padding:.6rem 1rem;flex-wrap:wrap}
.brand{font-size:1rem}
nav{display:flex;gap:.25rem;flex:1;flex-wrap:wrap}
nav button{background:none;border:1px solid transparent;color:var(--mut);
  padding:.35rem .7rem;border-radius:8px;cursor:pointer;font-size:.9rem}
nav button:hover{background:var(--surface-2);color:var(--text)}
nav button.on{background:var(--surface-2);border-color:var(--border);color:var(--text);font-weight:600}
.who{font-size:.82rem;color:var(--mut);display:flex;gap:.5rem;align-items:center}
main{padding:1rem;max-width:1400px;margin:0 auto}

input,select,textarea,button{font:inherit;color:var(--text);background:var(--surface);
  border:1px solid var(--border-2);border-radius:8px;padding:.4rem .6rem}
textarea{width:100%;font-family:var(--mono);font-size:.85rem;margin-top:.6rem}
button{cursor:pointer;background:var(--surface-2)}
button:hover{border-color:var(--accent)}
button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
button.link{background:none;border:none;color:var(--accent);padding:.2rem;text-decoration:underline}

.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.1rem}
.two{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}
@media(max-width:900px){.two{grid-template-columns:1fr}}
.scroll{overflow:auto;max-height:440px}

/* KPI */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.7rem}
.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.75rem .9rem}
.kpi .n{font-size:1.7rem;font-weight:650;line-height:1.1}
.kpi .l{font-size:.8rem;color:var(--mut);margin-top:.15rem}
.kpi.alarm{border-color:var(--stop);background:var(--stop-bg)}

/* воронка */
.funnel{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:.6rem}
.step{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:.7rem .75rem;cursor:pointer;position:relative}
.step:hover{border-color:var(--accent)}
.step .n{font-size:1.5rem;font-weight:650;line-height:1.1}
.step .l{font-size:.82rem;margin-top:.1rem}
.step .m{font-size:.72rem;color:var(--mut);margin-top:.35rem;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.step .badge{position:absolute;top:.5rem;right:.5rem;font-size:.7rem;
  background:var(--stop-bg);color:var(--stop);border-radius:6px;padding:.05rem .35rem}
.step.empty{opacity:.45}

/* канбан */
.board{display:flex;gap:.7rem;overflow-x:auto;padding-bottom:1rem;align-items:flex-start}
.col{flex:0 0 235px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:.6rem;min-height:120px}
.col.over{border-color:var(--accent);background:var(--surface-2)}
.col h4{margin:0 0 .5rem;font-size:.85rem;display:flex;justify-content:space-between}
.col h4 span{color:var(--mut);font-weight:400}
.chip{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;
  padding:.35rem .5rem;margin-bottom:.35rem;cursor:grab;font-size:.82rem}
.chip:active{cursor:grabbing}
.chip .sub{color:var(--mut);font-size:.74rem}
.col .more{font-size:.76rem;color:var(--mut);text-align:center;padding:.3rem}

/* таблица */
.filters{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.7rem;align-items:center}
.filters input{min-width:210px}
table{width:100%;border-collapse:collapse;background:var(--surface);font-size:.85rem}
th,td{padding:.45rem .6rem;border-bottom:1px solid var(--border);text-align:left;white-space:nowrap}
th{position:sticky;top:0;background:var(--surface-2);cursor:pointer;user-select:none;font-weight:600}
th:hover{color:var(--accent)}
th .ar{color:var(--mut);font-size:.75em}
tbody tr:hover{background:var(--surface-2);cursor:pointer}
.pill{display:inline-block;padding:.05rem .4rem;border-radius:6px;font-size:.76rem}
.pill.ok{background:var(--ok-bg);color:var(--ok)}
.pill.warn{background:var(--warn-bg);color:var(--warn)}
.pill.stop{background:var(--stop-bg);color:var(--stop)}
.pager{display:flex;gap:.4rem;align-items:center;margin-top:.7rem;font-size:.85rem;color:var(--mut)}

/* задачи и алерты */
.item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:.7rem .9rem;margin-top:.6rem;display:flex;gap:.8rem;align-items:flex-start}
.item.high{border-left:3px solid var(--stop)}
.item.critical{border-left:3px solid var(--stop);background:var(--stop-bg)}
.item .grow{flex:1}
.item .t{font-weight:600}
.item .d{color:var(--mut);font-size:.83rem;margin-top:.2rem}
.form-row{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.form-row input{flex:1;min-width:150px}

/* подсказка */
.hint{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;
  background:var(--surface-2);border:1px solid var(--border-2);color:var(--mut);
  font-size:.7rem;cursor:help;vertical-align:middle}
.tip{position:fixed;z-index:60;max-width:330px;background:var(--text);color:var(--bg);
  padding:.5rem .7rem;border-radius:8px;font-size:.8rem;line-height:1.45;pointer-events:none}

/* карточка аккаунта */
.drawer{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:40;display:flex;justify-content:flex-end}
.drawer-in{background:var(--surface);width:min(560px,100vw);height:100%;overflow:auto;padding:1.2rem 1.4rem}
.kv{display:grid;grid-template-columns:150px 1fr;gap:.2rem .8rem;font-size:.86rem;margin:.6rem 0}
.kv div:nth-child(odd){color:var(--mut)}
.log{font-family:var(--mono);font-size:.76rem;border-top:1px solid var(--border);padding:.3rem 0}

.toast{position:fixed;bottom:1.2rem;left:50%;transform:translateX(-50%);z-index:70;
  background:var(--text);color:var(--bg);padding:.6rem 1rem;border-radius:9px;font-size:.87rem}
