/* a2 (04.11.2026) — дизайн-система пульта: переменные + классы. Цвет семейства раздела задаётся body[data-fam] (ставит ds.js),
   карточки получают тонированную шапку, кнопки окрашены по смыслу (data-intent / классы), статусы и суммы выделены.
   Принципы оформления (contrast, иерархия, сетка 8px, focus, читаемый текст, семантика статусов) и 5 тем — в themes.css.
   «Стандарт» — эти токены :root без переопределения. */
:root{
  --ds-bg:#0d1017;--ds-card:#151a24;--ds-card2:#1a2030;--ds-line:#273047;--ds-txt:#e8ecf3;--ds-mut:#9aa6ba;
  --ds-blue:#3b82f6;--ds-violet:#8b5cf6;--ds-teal:#14b8a6;--ds-green:#22c55e;--ds-amber:#f59e0b;--ds-gold:#eab308;--ds-red:#ef4444;
  --ds-cyan:#06b6d4;--ds-indigo:#6366f1;--ds-pink:#ec4899;--ds-slate:#64748b;--ds-purple:#a855f7;
  --fam:var(--ds-indigo);--ds-r:12px;--ds-shadow:0 1px 0 #ffffff08 inset,0 6px 18px #0006;
  --bg:var(--ds-bg);--card:var(--ds-card);--line:var(--ds-line);--txt:var(--ds-txt);--mut:var(--ds-mut);--acc:var(--ds-blue);--ok:#16a34a;--warn:#d97706;--bad:#dc2626}
body[data-fam=sites]{--fam:var(--ds-blue)}body[data-fam=agents]{--fam:var(--ds-violet)}body[data-fam=domains]{--fam:var(--ds-teal)}
body[data-fam=seo]{--fam:var(--ds-green)}body[data-fam=monitor]{--fam:var(--ds-amber)}body[data-fam=finance]{--fam:var(--ds-gold)}
body[data-fam=danger]{--fam:var(--ds-red)}body[data-fam=bots]{--fam:var(--ds-cyan)}body[data-fam=analytics]{--fam:var(--ds-indigo)}
body[data-fam=personal]{--fam:var(--ds-pink)}body[data-fam=data]{--fam:var(--ds-slate)}body[data-fam=ai]{--fam:var(--ds-purple)}body[data-fam=main]{--fam:var(--ds-indigo)}
body{background:radial-gradient(1200px 500px at 70% -200px,color-mix(in srgb,var(--fam) 10%,transparent),transparent 70%),var(--ds-bg);background-attachment:fixed}
/* заголовки раздела — с цветной полосой семейства */
main>h1,main>h2,main .ds-h{position:relative;padding-left:12px}
main>h1::before,main>h2::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:4px;border-radius:3px;background:var(--fam)}
main>h1{font-size:23px;letter-spacing:.2px}
/* карточки: единый вид, тонированная шапка цветом семейства */
.card{background:linear-gradient(180deg,color-mix(in srgb,var(--fam) 8%,var(--ds-card)) 0,var(--ds-card) 64px);border:1px solid var(--ds-line);
  border-top:3px solid color-mix(in srgb,var(--fam) 70%,var(--ds-line));border-radius:var(--ds-r);box-shadow:var(--ds-shadow)}
.card>h3:first-child,.card>h2:first-child,.card>b:first-child,.ds-card-h{color:color-mix(in srgb,var(--fam) 45%,var(--card-h-mix,#fff))}
.ds-card-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-weight:600;font-size:16px;margin:-2px 0 8px}
.card[data-acc=violet],.ds-tint-violet{--fam:var(--ds-violet)}.card[data-acc=teal]{--fam:var(--ds-teal)}.card[data-acc=gold],.ds-tint-gold{--fam:var(--ds-gold)}
.card.sev-critical,.ds-tint-red{--fam:var(--ds-red)}.card.sev-warning,.ds-tint-amber{--fam:var(--ds-amber)}.ds-tint-green{--fam:var(--ds-green)}
.ds-tint-amber,.ds-tint-red,.ds-tint-green,.ds-tint-gold{background:color-mix(in srgb,var(--fam) 12%,var(--ds-card));border-color:color-mix(in srgb,var(--fam) 45%,var(--ds-line))!important}
/* кнопки по смыслу: основная — синяя, создать/сохранить — зелёная, осторожно — янтарная, удалить — красная, нейтральная — серая */
button,.btn{border-radius:9px;font-weight:500;transition:filter .12s,transform .06s,box-shadow .12s;box-shadow:var(--btn-shadow,0 1px 0 #ffffff1a inset)}
button:active,.btn:active{transform:translateY(1px)}
button:focus-visible,.btn:focus-visible,a:focus-visible,input:focus,select:focus,textarea:focus{outline:2px solid var(--focus,color-mix(in srgb,var(--fam) 70%,#fff));outline-offset:1px}
button:not(.ghost):not([data-intent]),.btn:not(.ghost):not([data-intent]),.ds-btn.primary,button[data-intent=primary]{background:var(--btn-primary,linear-gradient(180deg,#4b8df8,#2f6fe0));color:var(--btn-primary-fg,#fff)}
.ds-btn.success,button.ok,button[data-intent=success],.btn[data-intent=success]{background:var(--btn-success,linear-gradient(180deg,#22b35e,#16924a))!important;color:var(--btn-success-fg,#fff)!important;border:0!important}
.ds-btn.warn,button.warn,button[data-intent=warn],.btn[data-intent=warn]{background:var(--btn-warn,linear-gradient(180deg,#e0a024,#c07f0a))!important;color:var(--btn-warn-fg,#1b1200)!important;border:0!important}
.ds-btn.danger,button.no,.btn.no,button[data-intent=danger],.btn[data-intent=danger]{background:var(--btn-danger,linear-gradient(180deg,#e5484d,#c53035))!important;color:var(--btn-danger-fg,#fff)!important;border:0!important}
button.ghost[data-intent=danger],.btn.ghost[data-intent=danger]{background:transparent!important;border:1px solid var(--ghost-danger-line,#c5303599)!important;color:var(--ghost-danger-fg,#ff8f8f)!important}
button.ghost[data-intent=success]{background:transparent!important;border:1px solid var(--ghost-ok-line,#16924a99)!important;color:var(--ghost-ok-fg,#6fe3a0)!important}
.ds-btn.neutral,button.ghost,.btn.ghost,button[data-intent=neutral]{background:var(--ghost-bg,#ffffff08);border:1px solid var(--ds-line);color:var(--ghost-fg,var(--ds-txt))}
button.ghost:hover,.btn.ghost:hover{background:var(--ghost-hover,#ffffff12);border-color:color-mix(in srgb,var(--fam) 50%,var(--ds-line))}
.ds-btn{border:0;padding:8px 13px;cursor:pointer}
/* статусы, суммы и важные тексты */
.ds-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px;font-size:12.5px;font-weight:600;border:1px solid transparent}
.ds-ok{color:var(--badge-ok-fg,#5ee59a);background:var(--badge-ok-bg,#16a34a22);border-color:var(--badge-ok-line,#16a34a55)}.ds-warn{color:var(--badge-warn-fg,#ffc761);background:var(--badge-warn-bg,#d9770622);border-color:var(--badge-warn-line,#d9770655)}
.ds-bad{color:var(--badge-bad-fg,#ff8a8a);background:var(--badge-bad-bg,#dc262622);border-color:var(--badge-bad-line,#dc262655)}.ds-info{color:var(--badge-info-fg,#8cc0ff);background:var(--badge-info-bg,#3b82f622);border-color:var(--badge-info-line,#3b82f655)}
.ds-muted{color:var(--ds-mut);background:var(--badge-mut-bg,#ffffff0a);border-color:var(--ds-line)}
.ds-money,.money{color:var(--money,#ffd76a);font-weight:600}.sev-warning:not(.card){color:var(--sev-warning,#ffc761)}.sev-critical:not(.card){color:var(--sev-critical,#ff8a8a)}
.ag-pill.done{background:#16a34a2a;color:#6fe3a0}.ag-pill.failed{background:#dc26262a;color:#ff9a9a}.ag-pill.running{background:#3b82f62a;color:#9cc7ff}
.ag-pill.queued{background:#ffffff12;color:var(--ds-mut)}.ag-pill.waiting_approval{background:#d977062a;color:#ffc761}
/* таблицы и поля */
th{background:color-mix(in srgb,var(--fam) 10%,var(--th-bg,transparent));color:color-mix(in srgb,var(--fam) 35%,var(--th-mix,#cfd6e4));font-weight:600}
tbody tr:nth-child(even) td{background:var(--zebra,transparent)}
tbody tr:hover td{background:var(--row-hover,#ffffff05)}
input,textarea,select{background:var(--input-bg,#10141d);color:var(--input-fg,#eee);border-color:var(--input-line,#2c3550)}
/* меню слева: активный пункт цветом группы */
nav{background:var(--nav-bg,#0f131c)}nav a.on{background:color-mix(in srgb,var(--gc,var(--fam)) 22%,var(--nav-on-mix,#151a24));color:var(--nav-on-fg,#fff);box-shadow:inset 3px 0 0 var(--gc,var(--fam))}
/* вкладки агента */
.ag-tabs button.on{background:color-mix(in srgb,var(--ds-violet) 30%,var(--ds-card))!important;border-color:var(--ds-violet)!important;color:#fff!important}
/* переключатели */
.ds-switch{display:flex;gap:8px;align-items:center;padding:6px 0;cursor:pointer}.ds-switch input{width:auto;accent-color:var(--fam)}
.ds-empty{padding:18px;text-align:center;color:var(--ds-mut);border:1px dashed var(--ds-line);border-radius:10px}
/* подключённые аккаунты */
.acc-list{display:flex;flex-direction:column;gap:8px}
.acc-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid var(--ds-line);border-radius:10px;
  background:color-mix(in srgb,var(--ds-violet) 5%,var(--ds-card2))}
.acc-ic{font-size:24px;width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:color-mix(in srgb,var(--ds-violet) 18%,transparent)}
.acc-act{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.acc-main>div{margin-top:3px}
/* колокольчик уведомлений */
#ntfBell{position:relative;background:var(--bell-bg,#ffffff0a)!important;border:1px solid var(--ds-line)!important;color:var(--bell-fg,#fff)!important;padding:6px 10px;font-size:16px}
#ntfBell .cnt{position:absolute;top:-6px;right:-6px;background:#e5484d;color:#fff;border-radius:999px;font-size:11px;min-width:18px;height:18px;line-height:18px;padding:0 5px;font-weight:700}
#ntfPanel{position:fixed;top:64px;right:12px;width:min(420px,calc(100vw - 24px));max-height:70vh;overflow:auto;z-index:50;background:var(--ds-card);
  border:1px solid var(--ds-line);border-top:3px solid var(--ds-violet);border-radius:12px;box-shadow:0 18px 40px #000a;padding:10px}
#ntfPanel .it{padding:8px;border-radius:8px;border:1px solid transparent;margin:4px 0;cursor:pointer}#ntfPanel .it.un{background:#8b5cf614;border-color:#8b5cf655}
#ntfPanel .it:hover{background:#ffffff0a}#ntfPanel .k-error{border-left:3px solid #e5484d}#ntfPanel .k-done{border-left:3px solid #22c55e}
#ntfPanel .k-question{border-left:3px solid #f59e0b}#ntfPanel .k-ask,#ntfPanel .k-test{border-left:3px solid #8b5cf6}
@media(max-width:760px){button,.btn{min-height:40px}.acc-row{grid-template-columns:40px minmax(0,1fr)}.acc-act{grid-column:1/-1;justify-content:flex-start}
  main>h1{font-size:20px}.card{border-radius:10px}
  html,body{overflow-x:hidden;max-width:100vw}header{flex-wrap:wrap;row-gap:6px;min-width:0}header>*{min-width:0}
  #ntfBell{padding:4px 8px;font-size:14px;min-height:36px}}

/* t304A polish */
button.warn,.btn.warn{background:var(--ds-amber,#f59e0b);color:#111;border:0}
button.danger,.btn.danger{background:var(--ds-red,#ef4444);color:#fff;border:0}
button.success,.btn.success{background:var(--ds-green,#22c55e);color:#041;border:0}
.sev-warn{border-left:3px solid var(--ds-amber,#f59e0b)}
.sev-critical{border-left:3px solid var(--ds-red,#ef4444)}
#hdrRf,#hdrHeal{white-space:nowrap}
@media(max-width:760px){#hdrRf,#hdrHeal{font-size:12px;padding:4px 8px}}