/* Каспийский Вял — слой дизайна v3 (сценарии, виды, оформления). Подключается после admin.css */

/* ---------- цвета шагов сценария ---------- */
:root{
  --k-text:#0B7A7C;--k-text-bg:#D3EEED;--k-text-on:#FFFFFF;
  --k-photo:#E39B2D;--k-photo-bg:#FCE7BC;--k-photo-on:#2A1A00;
  --k-set:#C9480F;--k-set-bg:#F9D6C2;--k-set-on:#FFFFFF;
  --k-voice:#4350C8;--k-voice-bg:#DADFFA;--k-voice-on:#FFFFFF;
  --k-reminder:#7B3FC4;--k-reminder-bg:#E7D9F8;--k-reminder-on:#FFFFFF;
  --k-question:#1E4577;--k-question-bg:#D2E0F0;--k-question-on:#FFFFFF;
  --k-wait:#5A6E7B;--k-wait-bg:#E1E8EC;--k-wait-on:#FFFFFF;
  --k-notify:#C73B2B;--k-notify-bg:#F9D7D1;--k-notify-on:#FFFFFF;
}
:root[data-theme=dark]{
  --k-text:#4FC3C5;--k-text-bg:#124045;--k-text-on:#04282A;
  --k-photo:#F0B658;--k-photo-bg:#3B2C0D;--k-photo-on:#2A1A00;
  --k-set:#F2916A;--k-set-bg:#44261A;--k-set-on:#3A1402;
  --k-voice:#9AA3F5;--k-voice-bg:#252B66;--k-voice-on:#10143A;
  --k-reminder:#C39BEA;--k-reminder-bg:#31234A;--k-reminder-on:#24103E;
  --k-question:#8DB5E8;--k-question-bg:#183558;--k-question-on:#0B2038;
  --k-wait:#A8B8C2;--k-wait-bg:#243640;--k-wait-on:#10202A;
  --k-notify:#F28C7A;--k-notify-bg:#4A241E;--k-notify-on:#3A0E07;
}
.k-text{--c:var(--k-text);--cbg:var(--k-text-bg);--on:var(--k-text-on)}
.k-photo{--c:var(--k-photo);--cbg:var(--k-photo-bg);--on:var(--k-photo-on)}
.k-set{--c:var(--k-set);--cbg:var(--k-set-bg);--on:var(--k-set-on)}
.k-voice{--c:var(--k-voice);--cbg:var(--k-voice-bg);--on:var(--k-voice-on)}
.k-reminder{--c:var(--k-reminder);--cbg:var(--k-reminder-bg);--on:var(--k-reminder-on)}
.k-question{--c:var(--k-question);--cbg:var(--k-question-bg);--on:var(--k-question-on)}
.k-wait,.k-waitreply,.k-pause{--c:var(--k-wait);--cbg:var(--k-wait-bg);--on:var(--k-wait-on)}
.k-notify,.k-handoff{--c:var(--k-notify);--cbg:var(--k-notify-bg);--on:var(--k-notify-on)}

.kpill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;border-radius:999px;background:var(--cbg);color:var(--c);font-size:13px;font-weight:600;white-space:nowrap}
.ksub{font-size:12.5px;color:var(--mute)}
.nn{flex:none;display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:12px;background:var(--soft);color:var(--mute);font:600 12.5px var(--f-ui);font-variant-numeric:tabular-nums}
.tlab{font-size:12.5px;color:var(--mute);margin-left:auto;white-space:nowrap}
.txt.soft,.soft{color:var(--mute)}

/* пометка «что если клиент молчит» */
.snote{display:flex;gap:8px;align-items:flex-start;margin-top:12px;padding:9px 12px;border-radius:10px;border:1px dashed color-mix(in srgb,var(--mute) 45%,var(--line));background:color-mix(in srgb,var(--soft) 60%,transparent);color:var(--mute);font-size:13.5px;line-height:1.4}
.snote svg{flex:none;margin-top:1px}
.snote b{color:var(--ink);font-weight:600}
.snote.end{border-style:solid;border-color:transparent;background:transparent;padding-left:0;padding-right:0}

/* ---------- переключатель вида ---------- */
.sview{min-width:0}
.vtabs{display:flex;gap:4px;padding:4px;background:var(--soft);border-radius:12px;width:max-content;max-width:100%;overflow:auto;margin-bottom:var(--sp-3)}
.vtab{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:9px;color:var(--mute);text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap;transition:background .15s,color .15s}
.vtab:hover{color:var(--ink)}
.vtab.on{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(16,43,60,.12)}
.vintro{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.vintro p{margin:0;color:var(--mute);font-size:14px;max-width:60ch}
.vintro form{margin:0}
.ihint{color:var(--mute);font-size:13px;text-decoration:underline;text-underline-offset:3px}

/* ---------- 1. лента ---------- */
.node .nh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.node .acts{display:flex;gap:2px;margin-left:8px}
.node .acts form{margin:0}
.stop .pin{border-color:var(--c,var(--mute));color:var(--c,var(--mute));background:var(--cbg,var(--card))}
.stop.first .pin,.stop.trig .pin{background:var(--soft);border-color:var(--mute);color:var(--mute)}
.stop.trig .node .ttl{font-size:14px;font-weight:700;color:var(--ink)}
.t-wait_silent .node{background:var(--card)}
.stop.k-wait .node,.stop.k-pause .node,.stop.k-waitreply .node{background:var(--cbg);border-style:dashed}
.endcap{display:flex;align-items:center;gap:10px;color:var(--mute);font-size:14px;font-weight:600;padding:2px 0 0 10px}

/* ---------- 2. схема ---------- */
.fl{display:flex;flex-direction:column;align-items:center;max-width:620px;margin:0 auto}
.fl .arrow{display:block;width:2px;height:26px;background:var(--line);position:relative;margin:0}
.fl .arrow::after{content:"";position:absolute;left:50%;bottom:-1px;width:9px;height:9px;border-right:2px solid var(--line);border-bottom:2px solid var(--line);transform:translateX(-50%) rotate(45deg)}
.fl-cap{display:flex;gap:10px;align-items:center;padding:12px 18px;border-radius:999px;background:var(--deep);color:#fff;max-width:100%}
.fl-cap span{color:#BCD0DC;font-size:13px}
.fl-cap.end{background:var(--soft);color:var(--ink)}.fl-cap.end span{color:var(--mute)}
.fl-box{width:100%;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow);position:relative}
.fl-box::before{content:"";position:absolute;left:18px;right:18px;top:0;height:3px;border-radius:0 0 3px 3px;background:var(--c)}
.fl-h{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}.fl-h .ib{margin-left:auto}
.fl-mini{display:inline-flex;gap:8px;align-items:center;padding:6px 14px;border-radius:999px;background:var(--cbg);color:var(--c);font-size:13px;font-weight:600}
.fl-dec{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center;width:100%}
.dec{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;padding:14px 22px;border-radius:18px;background:var(--cbg);border:1.5px solid var(--c);color:var(--c)}
.dec b{color:var(--ink);font-size:14px}.dec span{font-size:12.5px;color:var(--mute)}
.fl-side{font-size:13px;color:var(--mute);text-align:right;line-height:1.35}
.fl-no{font-size:13px;color:var(--mute)}
.yes,.no{display:inline-block;padding:1px 8px;border-radius:8px;font-weight:700;font-size:12px;margin-right:4px}
.yes{background:var(--k-text-bg);color:var(--k-text)}.no{background:var(--k-notify-bg);color:var(--k-notify)}

/* ---------- 3. дерево ---------- */
.treewrap{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;box-shadow:var(--shadow)}
.troot{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px 14px;border-radius:12px;background:var(--deep);color:#fff;margin-bottom:6px}
.troot span{color:#BCD0DC;font-size:13px}
ul.tree{list-style:none;margin:0;padding:0 0 0 26px;position:relative}
ul.tree::before{content:"";position:absolute;left:11px;top:0;bottom:14px;width:2px;background:var(--line)}
ul.tree>li{position:relative;padding:8px 0 0 18px}
ul.tree>li::before{content:"";position:absolute;left:-15px;top:30px;width:30px;height:2px;background:var(--line)}
.tnode{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;gap:8px 10px;flex-wrap:wrap;align-items:center}
.tnode .txt,.tnode .chips,.tnode .cap{flex-basis:100%}
.tnode .ib{margin-left:auto}
.tbranch details{border:1px dashed color-mix(in srgb,var(--mute) 50%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--soft) 55%,transparent)}
.tbranch summary{display:flex;align-items:center;gap:8px;padding:10px 14px;cursor:pointer;font-weight:600;font-size:14px;list-style:none;color:var(--ink)}
.tbranch summary::-webkit-details-marker{display:none}
.tbranch summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);transform:rotate(45deg);transition:transform .2s}
.tbranch details[open]>summary::after{transform:rotate(-135deg)}
.tbranch summary .ans{font-weight:400;color:var(--mute);font-size:13px;margin-left:6px}
.tbranch details>ul.tree{padding-bottom:12px;padding-right:12px}
.tbranch details[open]>ul.tree{animation:grow .22s cubic-bezier(.2,.8,.2,1)}
@keyframes grow{from{opacity:0;transform:translateY(-6px)}}
.tend{display:flex;gap:8px;align-items:center;color:var(--mute);font-size:14px;font-weight:600;padding-top:12px}

/* ---------- 4. по времени ---------- */
.tl-sim{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:var(--sp-4);padding:12px 16px;background:var(--card);border:1px solid var(--line);border-radius:12px}
.tl-sim .lbl{margin:0}.tl-sim input[type=time]{width:auto;min-height:38px}
.tl{position:relative}
.tl-g{display:grid;grid-template-columns:150px minmax(0,1fr);gap:0 18px;position:relative;padding-bottom:18px}
.tl-g::before{content:"";position:absolute;left:150px;top:10px;bottom:-2px;width:2px;margin-left:-10px;background:repeating-linear-gradient(to bottom,var(--line) 0 6px,transparent 6px 10px)}
.tl-g:last-child::before{display:none}
.tl-t{display:flex;flex-direction:column;align-items:flex-end;text-align:right;padding-top:6px;position:relative}
.tl-t b{font-size:15px}
.tl-t::after{content:"";position:absolute;right:-27px;top:11px;width:12px;height:12px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 4px var(--bg)}
.tl-clock{font-size:13px;color:var(--mute);font-variant-numeric:tabular-nums}
.tl-clock.late{color:var(--k-notify);font-weight:600}
.tl-c{display:flex;flex-direction:column;gap:8px;padding-left:10px}
.tl-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;box-shadow:var(--shadow)}
.tl-h{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.tl-h .ib{margin-left:auto}
.tl-end{display:flex;gap:8px;align-items:center;color:var(--mute);padding:8px 0}
@media (max-width:640px){.tl-g{grid-template-columns:1fr}.tl-g::before{display:none}.tl-t{align-items:flex-start;text-align:left;flex-direction:row;gap:10px;align-items:baseline}.tl-t::after{display:none}.tl-c{padding-left:0}}

/* ---------- 5. плитки ---------- */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.tile{display:flex;flex-direction:column;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .15s,border-color .15s;min-height:132px}
a.tile:hover{transform:translateY(-2px);border-color:var(--c)}
.tile .th{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tile p{margin:0;font-size:14px;line-height:1.4;color:var(--ink);flex:1}
.tile .tf{display:flex;gap:10px;flex-wrap:wrap;color:var(--mute);font-size:12.5px}.tile .tf span{display:inline-flex;gap:5px;align-items:center}
.tile.start,.tile.end,.tile.wait{justify-content:center;align-items:flex-start;min-height:96px;border-style:dashed;box-shadow:none;background:transparent}
.tile.start b,.tile.end b,.tile.wait b{font-size:15px}.tile.start>span,.tile.end>span,.tile.wait>span{font-size:13px;color:var(--mute)}
.tile.start{background:var(--deep);border-style:solid;color:#fff}.tile.start span{color:#BCD0DC}
.tile.wait{background:var(--cbg);border-color:var(--c);color:var(--c)}.tile.wait b{color:var(--ink)}

/* ---------- читаемость и цвет карточек ---------- */
.sview .txt{white-space:pre-wrap;word-break:break-word;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;font-size:14.5px;line-height:1.5}
.stop[class*="k-"] .node,.fl-box[class*="k-"],.tl-card[class*="k-"],li.tn[class*="k-"]>.tnode,a.tile[class*="k-"]{background:color-mix(in srgb,var(--cbg) 38%,var(--card))}
.stop[class*="k-"] .node{border-color:color-mix(in srgb,var(--c) 28%,var(--line))}
.fl-box[class*="k-"],.tl-card[class*="k-"],li.tn[class*="k-"]>.tnode,a.tile[class*="k-"]{border-color:color-mix(in srgb,var(--c) 28%,var(--line))}
.stop .pin{width:44px;height:44px;border-width:2px}
.stop{grid-template-columns:44px minmax(0,1fr)}
.stop::before,.gap::before{left:21px}
.gap{grid-template-columns:44px minmax(0,1fr)}
.nn{background:color-mix(in srgb,var(--c,var(--mute)) 16%,var(--card));color:var(--c,var(--mute))}
/* интервал — раскрывающаяся строка */
.ivd{padding:0}
.ivd summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;cursor:pointer;list-style:none;font-size:14.5px}
.ivd summary::-webkit-details-marker{display:none}
.ivd summary span:first-child{display:inline-flex;gap:8px;align-items:center}
.ivd .ivch{color:var(--amber-d);font-weight:600;font-size:13.5px}
.ivd[open] .ivch{display:none}
.ivd .ivb{padding:0 20px 18px}

/* =====================  ОФОРМЛЕНИЕ «ВОЛНА»  ===================== */
:root{--prim:#0B2B4E;--on-prim:#FFFFFF}
:root:not([data-theme=dark]){--bg:#EDF2F5;--soft:#E4ECF0;--line:#D4DEE4;--deep:#0A2340;--deep2:#17395B;--amber-d:#8A5309}
body{font-size:16px}
.btn:not(.ghost):not(.line):not(.danger){background:var(--prim);color:var(--on-prim)}
:root[data-theme=dark] .btn:not(.ghost):not(.line):not(.danger){background:var(--amber);color:#2A1A00}
.top h1{font-size:clamp(24px,2.4vw,32px)}
.card{border-radius:18px}


/* ---------- файлы ---------- */
.upz{margin-bottom:var(--sp-4)}
.dropz{display:flex;align-items:center;gap:18px;padding:22px 24px;border:2px dashed color-mix(in srgb,var(--mute) 45%,var(--line));border-radius:var(--r);background:var(--card);cursor:pointer;color:var(--mute);transition:border-color .15s,background .15s}
.dropz:hover,.dropz.hot{border-color:var(--amber);background:var(--amber-bg)}
.dropz>svg{width:34px;height:34px;color:var(--amber-d);flex:none}
.dropz input{display:none}
.dz-t{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.dz-t b{font-size:17px;color:var(--ink)}.dz-t span{font-size:14px}
.dz-b{flex:none;pointer-events:none}
.dropz.busy{opacity:.7;pointer-events:none}
.upz .cap{margin:8px 4px 0}
.ftabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--sp-4)}
.ftabs button{display:inline-flex;gap:8px;align-items:center;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--mute);font:600 14px var(--f-ui);cursor:pointer;transition:all .15s}
.ftabs button b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.ftabs button:hover{color:var(--ink)}
.ftabs button.on{background:var(--ink);border-color:var(--ink);color:var(--card)}.ftabs button.on b{color:var(--card)}
.fcard[hidden]{display:none}
.fcard .pvw{position:relative;height:190px}
.fcard .kt{position:absolute;left:10px;top:10px;padding:3px 10px;border-radius:999px;background:rgba(10,35,64,.78);color:#fff;font-size:12px;font-weight:600}
.fcard .aud{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;padding:0 14px}.fcard .aud svg{width:34px;height:34px;color:var(--k-voice)}
.fname{display:flex;align-items:center;gap:6px;min-height:34px}
.fn-t{font-weight:650;font-size:15.5px;line-height:1.25;word-break:break-word}
.fname .rn{display:flex;gap:6px;flex:1}.fname .rn[hidden]{display:none}
.fmeta{color:var(--mute);font-size:13px;margin-top:-6px}
.where{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border-radius:10px;background:var(--soft);font-size:13px}
.where .wl{font-weight:600;color:var(--ink)}
.where .pl{color:var(--mute);text-decoration:none}.where .pl:hover{color:var(--ink);text-decoration:underline}
.where.free{background:transparent;border:1px dashed var(--line)}.where.free .wl{color:var(--mute)}.where .wh{color:var(--mute)}
.plm summary{cursor:pointer;color:var(--amber-d);font-weight:600}
.fa{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}
/* виды: плитки / список / компактно */
html[data-files="tiles"] .fgrid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
html[data-files="list"] .fgrid{grid-template-columns:1fr;gap:10px}
html[data-files="list"] .fcard{flex-direction:row;align-items:stretch}
html[data-files="list"] .fcard .pvw{width:180px;height:auto;min-height:130px;flex:none}
html[data-files="list"] .fcard .bd{flex:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) auto;gap:6px 24px;align-items:center}
html[data-files="list"] .fcard .fmeta{grid-column:1;margin:0}
html[data-files="list"] .fcard .where{grid-column:2;grid-row:1/3}
html[data-files="list"] .fcard .fa{grid-column:3;grid-row:1/3;margin:0;flex-direction:column;align-items:stretch}
html[data-files="compact"] .fgrid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
html[data-files="compact"] .fcard .pvw{height:110px}
html[data-files="compact"] .fcard .bd{padding:10px;gap:6px}
html[data-files="compact"] .fcard .where,html[data-files="compact"] .fcard .fmeta,html[data-files="compact"] .fcard .fa{display:none}
html[data-files="compact"] .fn-t{font-size:13.5px}
html[data-files="compact"] .fcard .kt{display:none}
@media (max-width:900px){html[data-files="list"] .fcard{flex-direction:column}html[data-files="list"] .fcard .pvw{width:auto;height:150px}html[data-files="list"] .fcard .bd{display:flex}}
@media (max-width:640px){.dropz{flex-wrap:wrap}.dz-b{width:100%}}

/* ---------- диалоги ---------- */
.pane{display:grid;grid-template-columns:minmax(0,1fr);min-width:0;min-height:0;background:var(--bg)}
.chatcol{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%}
.chatcol .hd{border-bottom:1px solid var(--line)}
.chatcol .msgs{min-height:0}
.cardside{display:none}
html[data-dlg="2"] .pane{grid-template-columns:minmax(0,1fr) 300px}
html[data-dlg="2"] .cardside{display:block;overflow:auto;padding:20px;background:var(--card);border-left:1px solid var(--line)}
html[data-dlg="2"] .chatcol .dstate{display:none}
html[data-dlg="2"] .chatcol .hd .owner{display:none}
.cardside h3{font-size:14px;color:var(--mute);font-weight:600;margin:0 0 10px}
.cardside dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0 0 22px;font-size:14px}
.cardside dt{color:var(--mute)}.cardside dd{margin:0;font-weight:500;text-align:right}
.owner{display:flex;align-items:center;gap:10px;padding:8px 14px;border-radius:12px;font-size:14px;flex:none}
.owner b{display:block;line-height:1.2}.owner small{color:inherit;opacity:.75;font-size:12px}
.owner .od{width:10px;height:10px;border-radius:50%;background:currentColor;flex:none}
.owner.bot{background:var(--k-text-bg);color:var(--k-text)}
.owner.man{background:var(--k-photo-bg);color:var(--k-photo)}
.owner b{color:var(--ink)}
.dstate{display:flex;flex-direction:column;gap:12px;padding:14px 16px;background:var(--card);border-bottom:1px solid var(--line)}
.stepper{display:flex;gap:0;list-style:none;margin:0;padding:0}
.stepper .st{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;text-align:center;font-size:12.5px;color:var(--mute)}
.stepper .st i{position:relative;z-index:1;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--soft);color:var(--mute);font:600 12.5px var(--f-ui);font-style:normal;border:2px solid var(--card)}
.stepper .st::before{content:"";position:absolute;top:12px;left:-50%;width:100%;height:2px;background:var(--line)}
.stepper .st:first-child::before{display:none}
.stepper .st.done i{background:var(--k-text);color:#fff}.stepper .st.done::before,.stepper .st.now::before{background:var(--k-text)}
.stepper .st.now i{background:var(--amber);color:#2A1A00;box-shadow:0 0 0 4px color-mix(in srgb,var(--amber) 25%,transparent)}.stepper .st.now{color:var(--ink);font-weight:600}
.stepper .st.stop i{background:var(--k-notify);color:#fff}
.stepper.v{flex-direction:column;gap:0}
.stepper.v .st{flex-direction:row;gap:12px;align-items:center;text-align:left;padding:6px 0}
.stepper.v .st::before{top:-14px;left:12px;width:2px;height:100%}
.stepper.v .st:first-child::before{display:none}
.refused{margin-top:8px;padding:8px 12px;border-radius:10px;background:var(--k-notify-bg);color:var(--k-notify);font-size:13.5px;font-weight:500}
.dstatus{font-size:14px;color:var(--ink)}
.dact{display:flex;gap:8px;flex-wrap:wrap}.dact form{margin:0}.dact.col{flex-direction:column;margin-top:14px}.dact.col .btn{width:100%}
.chatcol .hd .grow b{font-size:16px}
@media (max-width:900px){html[data-dlg="2"] .pane{grid-template-columns:1fr}html[data-dlg="2"] .cardside{display:none}html[data-dlg="2"] .chatcol .dstate{display:flex}html[data-dlg="2"] .chatcol .hd .owner{display:flex}.stepper .st span{font-size:11px}}

/* ---------- часы и менеджеры ---------- */
.sumline{margin-bottom:var(--sp-4);padding:14px 18px;border-radius:12px;background:var(--card);border:1px solid var(--line);font-size:15px;line-height:1.5}
.sumline b{font-weight:650}
.daybar{position:relative;height:30px;margin:6px 0 26px;border-radius:8px;background:var(--soft)}
.daybar i{position:absolute;top:0;bottom:0;border-radius:8px;background:linear-gradient(90deg,var(--k-text),color-mix(in srgb,var(--k-text) 70%,var(--amber)));opacity:.9}
.daybar span{position:absolute;top:34px;transform:translateX(-50%);font-size:12px;color:var(--mute);font-variant-numeric:tabular-nums}
.daybar span:first-of-type{transform:none}.daybar span:last-of-type{transform:translateX(-100%)}
details.adv{margin-top:var(--sp-4);border-top:1px solid var(--line);padding-top:var(--sp-3)}
details.adv>summary{display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none;font-weight:600;font-size:14.5px;padding:6px 0;color:var(--ink)}
details.adv>summary::-webkit-details-marker{display:none}
details.adv>summary::before{content:"";width:8px;height:8px;border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);transform:rotate(-45deg);transition:transform .2s;margin:0 4px 0 2px}
details.adv[open]>summary::before{transform:rotate(45deg)}
details.adv>summary .cap{margin:0 0 0 auto;font-weight:400}
details.adv[open]>*:not(summary){animation:grow .22s cubic-bezier(.2,.8,.2,1)}
details.adv .field{margin-top:var(--sp-4)}
details.adv.sect{margin-top:var(--sp-5)}
.sect0{padding-top:var(--sp-3)}
.chain{margin:var(--sp-4) 0 0;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.chain>summary{display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;font-weight:600;font-size:14.5px;list-style:none}
.chain>summary::-webkit-details-marker{display:none}.chain>summary .cap{margin:0 0 0 auto;font-weight:400}
.chain ol{list-style:none;margin:0;padding:4px 16px 12px;border-top:1px solid var(--line)}
.chain li{display:grid;grid-template-columns:130px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 0;border-bottom:1px dashed var(--line);font-size:14px}
.chain li:last-child{border:0}
.cl-t{color:var(--mute);font-weight:600}.cl-w b{font-weight:650}.cl-w{color:var(--mute)}
@media (max-width:640px){.chain li{grid-template-columns:1fr auto}.cl-t{grid-column:1/-1}}

/* ---------- список сценариев ---------- */
.dots{display:flex;gap:4px;flex-wrap:wrap;margin:2px 0 4px}
.dots .dot{width:12px;height:12px;border-radius:4px;background:var(--c);opacity:.85}
.snl{color:var(--amber-d);font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.flowcard h3{font-size:16.5px}

/* ---------- плавность ---------- */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .14s ease both}
::view-transition-new(root){animation:vt-in .22s cubic-bezier(.2,.8,.2,1) both}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0;transform:translateY(6px)}}
.main>.top,.main>.card,.main>form,.main>.studio,.main>.fgrid,.main>.flows,.main>.inbox,.main>.sumline{animation:rise .32s cubic-bezier(.2,.8,.2,1) both}
.main>*:nth-child(3){animation-delay:.03s}.main>*:nth-child(4){animation-delay:.06s}.main>*:nth-child(5){animation-delay:.09s}
@keyframes rise{from{opacity:0;transform:translateY(8px)}}
.flowcard,.tile,.fcard,.tl-card,.node,.fl-box{transition:transform .18s cubic-bezier(.2,.8,.2,1),border-color .18s,box-shadow .18s}
.vtab,.ftabs button,.fchip,.who,.side nav a,.btn,.ib{transition-property:background,color,border-color,transform,box-shadow,opacity;transition-duration:.16s;transition-timing-function:cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
html[data-files="list"] .fcard{align-items:center}
html[data-files="list"] .fcard .pvw{height:140px;min-height:0;align-self:stretch}
html[data-files="list"] .fcard .bd{padding:14px 18px}


/* ---------- насыщенные шаги: цветная шапка и заливка ---------- */
.kpill{background:var(--c);color:var(--on,#fff);font-weight:650;padding:4px 12px 4px 9px}
.ksub{font-weight:500}
.stop[class*="k-"] .pin{background:var(--c);border-color:var(--c);color:var(--on,#fff)}
.stop.first .pin,.stop.trig .pin{background:var(--soft);border-color:var(--mute);color:var(--mute)}
.stop[class*="k-"] .node,.tl-card[class*="k-"],li.tn[class*="k-"]>.tnode,a.tile[class*="k-"]{background:color-mix(in srgb,var(--cbg) 62%,var(--card));border-color:color-mix(in srgb,var(--c) 45%,var(--line))}
.nn{background:var(--card);color:var(--c,var(--mute));box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--c,var(--mute)) 55%,transparent);font-weight:700}
.snote{border-color:color-mix(in srgb,var(--c,var(--mute)) 50%,var(--line));background:color-mix(in srgb,var(--card) 72%,transparent)}
/* схема: цветная шапка карточки */
.fl-box{padding:0;overflow:hidden;border-color:color-mix(in srgb,var(--c) 55%,var(--line));background:color-mix(in srgb,var(--cbg) 62%,var(--card))}
.fl-box::before{display:none}
.fl-box>.fl-h{margin:0;padding:10px 14px;background:var(--c)}
.fl-box>.fl-h .kpill{background:rgba(255,255,255,.2);color:var(--on,#fff);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.fl-box>.fl-h .nn{background:rgba(255,255,255,.92);color:var(--c);box-shadow:none}
.fl-box>.fl-h .ib{color:var(--on,#fff);margin-left:auto}.fl-box>.fl-h .ib:hover{background:rgba(255,255,255,.2);color:var(--on,#fff)}
.fl-box>.txt,.fl-box>.chips,.fl-box>.cap,.fl-box>.snote{margin-left:16px;margin-right:16px}
.fl-box>.txt:first-of-type,.fl-box>.fl-h+.txt{margin-top:14px}
.fl-box>*:last-child{margin-bottom:14px}
.fl-box.k-waitreply{border-style:dashed}
.dec{background:var(--cbg);border:2px solid var(--c);color:var(--c)}.dec b{color:var(--ink)}
.fl-mini{background:var(--c);color:var(--on,#fff)}
.tile.wait{background:var(--c);border-color:var(--c);color:var(--on,#fff)}.tile.wait b{color:var(--on,#fff)}.tile.wait span{color:var(--on,#fff);opacity:.85}
.dots .dot{opacity:1}

/* ---------- файлы «компактно»: коротко про использование ---------- */
html[data-files="compact"] .fgrid{grid-template-columns:repeat(auto-fill,minmax(176px,1fr))}
html[data-files="compact"] .fcard .where{display:flex;padding:7px 10px;font-size:12.5px}
html[data-files="compact"] .fcard .where .pl,html[data-files="compact"] .fcard .where .plm,html[data-files="compact"] .fcard .where .wh{display:none}
html[data-files="compact"] .fcard .fa{display:flex;gap:6px}
html[data-files="compact"] .fcard .fa .btn{min-height:30px;padding:0 9px;font-size:12.5px}
html[data-files="compact"] .fcard .fa .btn svg{display:none}
.wc{display:none}
html[data-files="compact"] .where:not(.free) .wl{display:none}
html[data-files="compact"] .where:not(.free) .wc{display:block;font-weight:600;color:var(--ink)}
.k-goto{--c:var(--k-reminder);--cbg:var(--k-reminder-bg);--on:var(--k-reminder-on)}
.k-mark{--c:var(--k-wait);--cbg:var(--k-wait-bg);--on:var(--k-wait-on)}
.fl-box>.fl-h .ksub,.tnode .ksub{color:var(--on,#fff);opacity:.85}.tnode .ksub,.tl-h .ksub,.tile .ksub{color:var(--mute);opacity:1}

/* ---------- список разморозок: добавить / убрать ---------- */
.chain li{grid-template-columns:130px minmax(0,1fr) auto}
.cl-a{display:flex;gap:2px;justify-content:flex-end}
.cl-w .empty{color:var(--k-notify);font-style:normal;font-size:13.5px}
.cl-foot{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:12px 16px 14px;border-top:1px solid var(--line)}
.cl-foot .cap{margin:0}
.cl-add:disabled{opacity:.6;pointer-events:none}

/* ---------- список сценариев: путь клиента ---------- */
.vintro-t{margin:0 0 var(--sp-5);color:var(--mute);font-size:14.5px;max-width:70ch}
.jn{flex:none;display:inline-grid;place-items:center;min-width:34px;height:34px;padding:0 8px;border-radius:17px;background:var(--c);color:var(--on,#fff);font:700 15px var(--f-ui);font-style:normal;font-variant-numeric:tabular-nums}
.jcard{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;background:color-mix(in srgb,var(--cbg) 55%,var(--card));border:1.5px solid color-mix(in srgb,var(--c) 45%,var(--line));border-radius:var(--r);text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .18s cubic-bezier(.2,.8,.2,1),border-color .18s,box-shadow .18s}
.jcard:hover{transform:translateY(-2px);border-color:var(--c);box-shadow:0 10px 24px -14px color-mix(in srgb,var(--c) 60%,transparent)}
.jb{display:flex;flex-direction:column;gap:6px;min-width:0}
.jb b{font-size:16.5px;line-height:1.3}
.jcap{color:var(--mute);font-size:14px;line-height:1.35}
.jcard .dots{margin:2px 0 0}.jcard .meta{display:flex;gap:6px;flex-wrap:wrap}
.jr{display:flex;flex-direction:column;align-items:center;max-width:620px;margin:0 auto var(--sp-6)}
.jr-step{width:100%}
.jr-step .jcard,.jr-br .jcard{width:100%}
.jarrow{position:relative;display:block;width:3px;height:34px;background:color-mix(in srgb,var(--mute) 70%,var(--card));border-radius:2px;margin:0}
.jarrow::after{content:"";position:absolute;left:50%;bottom:-2px;width:13px;height:13px;border-right:3px solid color-mix(in srgb,var(--mute) 70%,var(--card));border-bottom:3px solid color-mix(in srgb,var(--mute) 70%,var(--card));transform:translateX(-50%) rotate(45deg)}
.jr-fork{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%;position:relative}
.jr-br{display:flex;flex-direction:column;gap:8px}
.jlab{align-self:flex-start;padding:2px 10px;border-radius:999px;font-size:12.5px;font-weight:700}
.jlab.yes{background:var(--k-text);color:var(--k-text-on)}.jlab.no{background:var(--k-notify);color:var(--k-notify-on)}
.grp{margin:0 0 var(--sp-6)}
.grp>h3{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:17px;margin-bottom:var(--sp-3)}
.grp>h3 .cap{margin:0;font-weight:400;flex-basis:100%;padding-left:0}
.gn{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--card);font:700 14px var(--f-ui);font-style:normal}
.jgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.newgrp .newrow{display:flex;gap:10px;flex-wrap:wrap}.newrow input{flex:1 1 220px;width:auto}
/* карта */
.mp{display:flex;align-items:center;gap:0;overflow:auto;padding:6px 2px 18px;margin-bottom:var(--sp-5)}
.mp-c{flex:1 1 0;min-width:230px}.mp-c .jcard{height:100%}
.marrow{flex:none;position:relative;width:46px;height:3px;background:color-mix(in srgb,var(--mute) 70%,var(--card));border-radius:2px}
.marrow::after{content:"";position:absolute;right:-1px;top:50%;width:13px;height:13px;border-right:3px solid color-mix(in srgb,var(--mute) 70%,var(--card));border-top:3px solid color-mix(in srgb,var(--mute) 70%,var(--card));transform:translateY(-50%) rotate(45deg)}
.mp-fork{display:flex;flex-direction:column;gap:14px}
@media (max-width:900px){.jr-fork{grid-template-columns:1fr}.mp{flex-direction:column;align-items:stretch}.marrow{width:3px;height:30px;align-self:center}.marrow::after{right:auto;left:50%;top:auto;bottom:-2px;border-top:0;border-right:3px solid color-mix(in srgb,var(--mute) 70%,var(--card));border-bottom:3px solid color-mix(in srgb,var(--mute) 70%,var(--card));transform:translateX(-50%) rotate(45deg)}}


/* ---------- схема: заметные стрелки, «+» на стрелке, перетаскивание ---------- */
.fl{--arrow:color-mix(in srgb,var(--mute) 72%,var(--card))}
.fl .arrow{background:var(--arrow);width:3px;border-radius:2px}
.fl .arrow::after{width:13px;height:13px;border-right:3px solid var(--arrow);border-bottom:3px solid var(--arrow);bottom:-2px}
.fl-gap{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-height:62px}
.fl-gap .arrow{position:absolute;left:50%;top:0;bottom:0;height:auto;margin:0 0 0 -1.5px}
.fl-gap .plus{position:relative;z-index:2;margin:0;width:30px;height:30px;background:var(--card);border:2px solid var(--arrow);color:var(--mute)}
.fl-gap .plus:hover,.fl-gap .plus[aria-expanded=true]{background:var(--amber);border-color:var(--amber);color:var(--ink-on-amber)}
.fl-gap .pick{position:relative;z-index:3;width:min(560px,100%);margin-top:8px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;box-shadow:var(--shadow)}
.fl-gap .pick.open{margin-bottom:16px}
.fl-box[draggable=true],.fl-dec[draggable=true],.fl-mini[draggable=true]{cursor:default}
.fl-box.dragging,.fl-dec.dragging,.fl-mini.dragging{opacity:.4}
.fl-box.over,.fl-dec.over,.fl-mini.over{outline:3px dashed var(--amber);outline-offset:4px}
.fl-box>.fl-h .acts{margin-left:auto;display:flex;gap:2px}
.fl-box>.fl-h .acts form{margin:0}
.fl-box>.fl-h .acts .ib{color:var(--on,#fff);width:32px;height:32px}
.fl-box>.fl-h .acts .ib:hover{background:rgba(255,255,255,.22);color:var(--on,#fff)}
.fl-box>.fl-h .grip{cursor:grab}
.dec{position:relative}
.dec .acts{display:flex;gap:2px;margin-top:6px}.dec .acts form{margin:0}.dec .acts .ib{width:30px;height:30px;color:var(--mute)}
.fl-mini{gap:6px}.fl-mini .acts{display:flex;margin-left:8px}.fl-mini .acts form{margin:0}.fl-mini .acts .ib{width:26px;height:26px;color:var(--on,#fff)}.fl-mini .acts .ib:hover{background:rgba(255,255,255,.22);color:var(--on,#fff)}
.stitle{font-weight:650;font-size:14.5px;color:var(--ink);margin-left:2px}
.fl-box>.fl-h .stitle{color:var(--on,#fff)}
.jarrow,.marrow{--arrow:color-mix(in srgb,var(--mute) 72%,var(--card))}
.fl-dec>.fl-side{grid-column:1;grid-row:1;text-align:right}
.fl-dec>.dec{grid-column:2;grid-row:1}
.fl-dec>.fl-no{grid-column:3;grid-row:1;text-align:left}
.fl-dec{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);width:100%}
.fl-dec .dec{cursor:default;min-width:190px}


/* ---------- рассылки ---------- */
.mlist{display:flex;flex-direction:column;gap:10px}
.mrow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:16px 20px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .18s,border-color .18s}
.mrow:hover{transform:translateY(-2px);border-color:var(--amber)}
.mr-t{display:flex;flex-direction:column;gap:2px;min-width:0}.mr-t b{font-size:16px}.mr-n{color:var(--mute);font-size:14px;text-align:right}
@media (max-width:640px){.mrow{grid-template-columns:1fr auto}.mr-n{grid-column:1/-1;text-align:left}}
.newrow .row2{display:flex;gap:10px;flex-wrap:wrap}.newrow .row2 input{flex:1 1 260px;width:auto}
.mhead{display:flex;align-items:center;gap:12px;margin:0 0 var(--sp-4)}.mhead .cap{margin:0}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-4)}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-4)}
@media (max-width:760px){.grid2,.grid3{grid-template-columns:1fr}}
.chips2{display:flex;gap:8px;flex-wrap:wrap}
.chp input{position:absolute;opacity:0;pointer-events:none}
.chp span{display:inline-flex;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-weight:600;font-size:14px;cursor:pointer;color:var(--mute);transition:all .15s}
.chp input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--card)}
.chp input:focus-visible+span{outline:2px solid var(--amber);outline-offset:2px}
.swrow2{display:flex;gap:var(--sp-5);flex-wrap:wrap;margin:4px 0 var(--sp-4)}.swrow2 .swrow{margin:0}
.mfilt{padding-bottom:var(--sp-4);margin-bottom:var(--sp-4);border-bottom:1px solid var(--line)}
.ctools{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:var(--sp-3)}
.cbtns{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.firstn{display:inline-flex;gap:8px;align-items:center;font-size:14px;color:var(--mute)}.firstn input{width:72px;min-height:34px;padding:6px 10px}
.tblwrap{overflow:auto;border:1px solid var(--line);border-radius:12px;max-height:460px}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{position:sticky;top:0;background:var(--soft);text-align:left;font-weight:600;color:var(--mute);padding:10px 14px;font-size:13px;white-space:nowrap}
.tbl td{padding:10px 14px;border-top:1px solid var(--line);vertical-align:middle}
.tbl tr:hover td{background:color-mix(in srgb,var(--soft) 55%,transparent)}
.tbl input[type=checkbox]{width:18px;height:18px;accent-color:var(--amber)}
.mstats{display:flex;gap:10px 22px;flex-wrap:wrap;margin-bottom:var(--sp-3);font-size:14.5px;color:var(--mute)}.mstats b{color:var(--ink);font-size:18px;margin-right:4px}
.testrow{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin:var(--sp-3) 0}.testrow .field{flex:1 1 260px;margin:0}
.mbtns{display:flex;gap:10px;flex-wrap:wrap;margin-top:var(--sp-4)}.mbtns form{margin:0}
.card .tip{margin-bottom:var(--sp-3)}
.btn[disabled]{opacity:.5;pointer-events:none}


/* ---------- схема: ровные стрелки по центру, наконечник виден над следующим шагом ---------- */
.fl{align-items:center}
.fl>*{width:100%}
.fl>.fl-cap{width:auto;max-width:100%}
.fl-gap{z-index:1;min-height:68px;padding:0}
.fl-gap .arrow{left:50%;top:0;bottom:7px;margin-left:-1.5px}
.fl-gap .arrow::after{bottom:-3px}
.fl-dec{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}
.fl-dec .dec{min-width:220px}
.fl-ans{display:flex;gap:8px 22px;flex-wrap:wrap;justify-content:center;max-width:560px;font-size:13px;color:var(--mute);text-align:center;line-height:1.4}
.fl-dec>.fl-side,.fl-dec>.fl-no{display:none}
.fl-mini{align-self:center;width:auto}


/* ---------- телефон справа едет за страницей ---------- */
.pw{position:sticky;top:16px;align-self:start;min-width:0}
.phone{position:relative;top:auto}
@media (max-width:1100px){.pw{position:static}}