@font-face{font-family:Manrope;src:url(/assets/manrope-regular.woff2) format("woff2"),url(/assets/manrope-regular.ttf) format("truetype");font-weight:400 500;font-display:swap}
@font-face{font-family:Manrope;src:url(/assets/manrope-semibold.woff2) format("woff2"),url(/assets/manrope-semibold.ttf) format("truetype");font-weight:600 800;font-display:swap}
@font-face{font-family:Oswald;src:url(/assets/oswald-bold.woff2) format("woff2"),url(/assets/oswald-bold.ttf) format("truetype");font-weight:700;font-display:swap}

:root{
 --paper:#f4f1ea;--ink:#141412;--line:#dcd6ca;--line-2:#e8e3d8;--muted:#6c675e;--card:#fffdf8;--white:#fff;
 --orange:#ff4b25;--green:#a9c77e;--blue:#80a9ed;
 --live:#4f82e6;--ok:#2f8a4f;--ok-bg:#e3f1e3;--err:#d9432a;--err-bg:#fbe4dd;--warn:#c27c12;--warn-bg:#f8ecd2;
 --cv:#151614;--cv-2:#1e1f1c;--cv-line:#363731;--cv-text:#f1efe8;--cv-muted:#9b988f;
 --m:clamp(16px,3.2vw,56px);--r:18px;--ease:cubic-bezier(.2,.8,.2,1);
 font-family:Manrope,Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;
}
*{box-sizing:border-box}
html{scroll-padding-top:12px}
body{margin:0;min-width:320px;background:var(--paper);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.45}
h1,h2,h3,h4,p,ol,ul,dl,dd,figure{margin:0}ol,ul{padding:0;list-style:none}a{color:inherit}
button,input,select{font:inherit;color:inherit}button{background:none;border:0;padding:0;cursor:pointer;touch-action:manipulation}
button:disabled{cursor:default}
:focus-visible{outline:2px solid var(--live);outline-offset:2px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:50;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px}.skip:focus{top:12px}
.i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.a-eyebrow{font-size:10px;font-weight:700;letter-spacing:.24em;line-height:1.6;color:var(--muted)}
.hint-narrow{display:none}

/* ---------- header & intro ---------- */
.a-header{height:76px;margin:0 var(--m);display:flex;align-items:center;justify-content:space-between}
.a-logo{display:block;width:112px;aspect-ratio:912/232;background:var(--ink);-webkit-mask:url(/assets/munir-wordmark-mask.png) center/100% 100% no-repeat;mask:url(/assets/munir-wordmark-mask.png) center/100% 100% no-repeat}
.a-brand:hover .a-logo{background:linear-gradient(90deg in oklch,#ff4b25 6%,#a9c77e 50%,#80a9ed 94%)}
.a-nav{display:flex;gap:24px;font-size:13px}.a-nav a{text-decoration:none;padding:10px 0;white-space:nowrap}.a-nav a:hover{text-decoration:underline;text-underline-offset:5px}
.a-intro{margin:4px var(--m) 22px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:end}
.a-intro h1{font-family:Oswald,'Arial Narrow',sans-serif;font-weight:700;font-size:clamp(36px,4.3vw,68px);line-height:1;letter-spacing:-.022em;margin:10px 0 14px;max-width:21ch;text-wrap:balance}
.a-lead{font-size:16px;line-height:1.5;color:var(--muted);max-width:600px}
.a-controls{display:flex;flex-direction:column;align-items:flex-end;gap:10px}

.seg{display:inline-flex;padding:4px;border:1px solid var(--line);border-radius:999px;background:var(--card);gap:2px}
.seg button{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:8px 16px;border-radius:999px;font-size:13px;font-weight:600;color:var(--muted);transition:background .25s,color .25s}
.seg button:hover{color:var(--ink)}
.seg button[aria-checked=true]{background:var(--ink);color:#fff}
.seg-scenario button[data-set-scenario=crm-down][aria-checked=true]{background:var(--err);color:#fff}
.seg-sm button{min-height:32px;padding:6px 12px;font-size:12px}.seg-sm .i{width:15px;height:15px}
.dot-err{width:8px;height:8px;border-radius:50%;background:var(--err)}
[aria-checked=true] .dot-err{background:#fff}

.btn-primary,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:999px;font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap;transition:transform .2s var(--ease),background .2s,box-shadow .2s}
.btn-primary{background:var(--ink);color:#fff}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 24px -12px #14141299}
.btn-primary:active,.btn-ghost:active{transform:scale(.97)}
.btn-ghost{border:1px solid var(--line);background:var(--card)}
.btn-ghost:hover{border-color:var(--ink)}
.btn-primary.sm,.btn-ghost.sm{min-height:36px;padding:7px 14px;font-size:13px}
.btn-primary .i,.btn-ghost .i{width:16px;height:16px}
.a-reset{min-height:38px;font-size:13px;padding:8px 14px}
.ico-replay,.ico-bolt{width:15px;height:15px;background:currentColor;-webkit-mask:var(--mi) center/contain no-repeat;mask:var(--mi) center/contain no-repeat}
.ico-replay{--mi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12a7.5 7.5 0 1 0 2.4-5.5'/%3E%3Cpath d='M4.5 4.5v4h4'/%3E%3C/svg%3E")}
.ico-bolt{--mi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 3 5.5 13.5H12L11 21l7.5-10.5H12Z'/%3E%3C/svg%3E")}

/* ---------- metrics ---------- */
.a-metrics{margin:0 var(--m) 22px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.metric{padding:14px 18px 14px 0;display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.metric+.metric{padding-left:18px;border-left:1px solid var(--line)}
.metric p{font-size:12px;font-weight:600;color:var(--muted)}
.metric b{font-family:Oswald,sans-serif;font-size:clamp(28px,2.6vw,40px);line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums;transition:color .4s}
.metric small{font-family:Manrope,sans-serif;font-size:13px;font-weight:600;color:var(--muted)}
.metric.tick b{animation:tick .7s var(--ease)}
@keyframes tick{0%{color:var(--live);transform:translateY(-3px)}100%{color:var(--ink);transform:none}}
.metric b{display:inline-block}
.metric-time b{color:var(--ink)}
.metric-note{grid-column:1/-1;padding:0 0 12px;font-size:11px;line-height:1.5;color:var(--muted);max-width:900px}

/* ---------- stage ---------- */
.a-stage{margin:0 var(--m);display:grid;grid-template-columns:minmax(330px,min(410px,31%)) minmax(0,1fr);gap:18px;height:min(920px,calc(100svh - 20px));min-height:720px}
.a-client,.a-work{min-height:0;min-width:0;display:flex;flex-direction:column}
.a-col-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;margin:0 0 9px;color:var(--ink)}
.a-col-label span,.st-n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font-size:11px;font-weight:700;flex:none}
.browser{flex:1;min-height:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:0 30px 60px -44px #14141266}
.browser-bar{display:flex;align-items:center;gap:10px;padding:9px 10px 9px 14px;background:#efece5;border-bottom:1px solid var(--line)}
.dots{display:flex;gap:6px}.dots i{width:10px;height:10px;border-radius:50%;background:#d6d1c6}
.url{flex:1;min-width:0;font-size:12px;color:var(--muted);background:#fff;border-radius:8px;padding:5px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.url span{font-size:10px}
.sample-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:var(--ink);color:#fff;font-size:12px;font-weight:700;white-space:nowrap;transition:transform .2s var(--ease)}
.sample-btn:hover{transform:translateY(-1px)}

/* ---------- the client's website («Блик») ---------- */
.site{--b:#0d6e5b;--b-ink:#0f2522;--b-soft:#e4f1ec;--b-lemon:#eef36a;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;color:var(--b-ink);background:#fff;scroll-behavior:smooth}
.site.flash{animation:siteflash 1s var(--ease)}
@keyframes siteflash{0%{box-shadow:inset 0 0 0 3px var(--b)}100%{box-shadow:inset 0 0 0 0 transparent}}
.site-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid #edf0ee}
.site-logo{position:relative;font-weight:800;font-size:22px;letter-spacing:-.04em;color:var(--b)}
.site-logo i{position:absolute;right:-9px;top:1px;width:8px;height:8px;background:var(--b-lemon);border-radius:2px;transform:rotate(45deg);box-shadow:0 0 0 2px var(--b)}
.site-tag{font-size:11px;font-weight:600;color:#5b6d68}
.site-hero{padding:22px 18px 6px;background:linear-gradient(180deg,var(--b-soft),#fff)}
.site-hero h2{font-size:25px;line-height:1.1;letter-spacing:-.02em;font-weight:800;max-width:15ch}
.site-hero p{margin-top:8px;font-size:13px;color:#4d5e59}
.site-form fieldset{border:0;margin:0;padding:16px 18px 6px;min-width:0}
.site-form legend{display:flex;align-items:center;gap:8px;padding:0;margin-bottom:10px;font-weight:800;font-size:14px}
.site-form legend>span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--b);color:#fff;font-size:11px}
.site-form legend small{font-weight:500;font-size:11px;color:#6b7a76}
.svc{display:grid;gap:7px}
.svc-card{position:relative;display:grid;grid-template-columns:38px 1fr auto;column-gap:10px;align-items:center;padding:10px 12px;border:1.5px solid #e1e8e5;border-radius:14px;cursor:pointer;transition:border-color .2s,background .2s,transform .2s var(--ease)}
.svc-card input{position:absolute;opacity:0;pointer-events:none}
.svc-card:hover{border-color:#b9d2c9}
.svc-card:has(input:checked){border-color:var(--b);background:var(--b-soft)}
.svc-card:has(input:focus-visible){outline:2px solid var(--b);outline-offset:2px}
.svc-art{grid-row:span 2;width:38px;height:38px;border-radius:11px;background:#f1f5f3;display:grid;place-items:center;color:var(--b);transition:background .2s}
.svc-card:has(input:checked) .svc-art{background:var(--b);color:#fff}
.svc-art svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.svc-card b{font-size:13.5px}
.svc-card small{grid-column:2;font-size:11px;color:#62736e;line-height:1.35}
.svc-card em{grid-row:1;grid-column:3;font-style:normal;font-size:11px;font-weight:700;color:var(--b);white-space:nowrap}
.qty{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 12px}
.qty-label{font-size:12.5px;font-weight:600;color:#40514c}
.qty-row{display:flex;align-items:center;gap:6px}
.qty-btn{width:32px;height:32px;border-radius:10px;border:1.5px solid #dbe5e1;font-size:17px;font-weight:600;line-height:1;transition:border-color .2s,background .2s}
.qty-btn:hover{border-color:var(--b);background:var(--b-soft)}
.qty-val{min-width:76px;text-align:center;font-weight:800;font-size:17px;font-variant-numeric:tabular-nums}.qty-val small{font-size:12px;font-weight:600;color:#62736e}
.qty input[type=range]{grid-column:1/-1;width:100%;height:24px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer}
.qty input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--b) var(--p,50%),#e1e8e5 var(--p,50%))}
.qty input[type=range]::-moz-range-track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--b) var(--p,50%),#e1e8e5 var(--p,50%))}
.qty input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;margin-top:-7px;border-radius:50%;background:#fff;border:2px solid var(--b);box-shadow:0 2px 6px #0d6e5b44}
.qty input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--b)}
.dirt{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}
.dirt label{position:relative;cursor:pointer}
.dirt input,.chip input{position:absolute;opacity:0;pointer-events:none}
.dirt span{display:block;height:100%;padding:8px 9px;border:1.5px solid #e1e8e5;border-radius:12px;transition:border-color .2s,background .2s}
.dirt b{display:block;font-size:12.5px}.dirt small{font-size:10.5px;color:#62736e}
.dirt input:checked+span{border-color:var(--b);background:var(--b-soft)}
.dirt input:focus-visible+span,.chip input:focus-visible+span{outline:2px solid var(--b);outline-offset:2px}
.extras{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.chip{position:relative;cursor:pointer}
.chip span{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border:1.5px solid #e1e8e5;border-radius:999px;font-size:12px;font-weight:600;transition:border-color .2s,background .2s}
.chip small{font-size:11px;color:#62736e;font-weight:600}
.chip input:checked+span{border-color:var(--b);background:var(--b);color:#fff}.chip input:checked+span small{color:#cfe7df}
.drop{display:flex;align-items:center;gap:12px;padding:14px;border:1.5px dashed #b9cfc7;border-radius:14px;cursor:pointer;color:var(--b);transition:background .2s,border-color .2s}
.drop:hover,.drop.is-over{background:var(--b-soft);border-color:var(--b)}
.drop .i{width:24px;height:24px}
.drop b{display:block;font-size:13px;color:var(--b-ink)}.drop small{font-size:11px;color:#62736e}
.drop.is-full{opacity:.45;pointer-events:none}
.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px}
.thumbs:empty{display:none}
.thumbs li{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;animation:pop .35s var(--ease)}
.thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.thumbs button{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;background:#0f2522cc;color:#fff;display:grid;place-items:center}
.thumbs button .i{width:13px;height:13px}
@keyframes pop{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
.contacts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.contacts legend{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:4px;min-width:0}
.field-wide{grid-column:1/-1}
.field>span{font-size:11.5px;font-weight:700;color:#40514c}
.field input{width:100%;min-height:42px;padding:9px 12px;border:1.5px solid #dbe5e1;border-radius:12px;background:#fff;font-size:14px;outline:none;transition:border-color .2s,box-shadow .2s}
.field input:focus{border-color:var(--b);box-shadow:0 0 0 3px #0d6e5b22}
.err{display:none;font-style:normal;font-size:11px;font-weight:600;color:var(--err)}
.field.is-error input{border-color:var(--err);animation:shake .35s}
.field.is-error .err{display:block}
@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.site-total{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding:12px 14px 12px 18px;background:#fffffff2;backdrop-filter:blur(8px);border-top:1px solid #e6ece9;box-shadow:0 -12px 24px -20px #0f252255}
.total-text{display:flex;flex-direction:column;min-width:0}
.total-text small{font-size:11px;font-weight:600;color:#62736e}
.total-sum{font-size:22px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.total-sum.bump{animation:bump .45s var(--ease)}
@keyframes bump{40%{transform:scale(1.06);color:var(--b)}}
.total-note{font-size:10.5px;color:#7b8a86}
.site-submit{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:10px 16px;border-radius:14px;background:var(--b);color:#fff;font-weight:800;font-size:14px;white-space:nowrap;transition:transform .2s var(--ease),background .2s,box-shadow .2s}
.site-submit:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 20px -10px #0d6e5b}
.site-submit:active:not(:disabled){transform:scale(.97)}
.site-submit:disabled{background:#9db7af}
.site-submit .i{width:17px;height:17px}
.site-done{padding:48px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.done-mark{width:68px;height:68px;border-radius:50%;background:var(--b);color:#fff;display:grid;place-items:center;animation:pop .5s var(--ease)}
.done-mark .i{width:34px;height:34px;stroke-width:2.4;stroke-dasharray:30;stroke-dashoffset:30;animation:draw .5s .25s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.site-done h3{font-size:22px;font-weight:800;letter-spacing:-.02em}
.done-text{font-size:13.5px;color:#4d5e59;max-width:300px}
.done-hint{display:inline-flex;align-items:center;gap:8px;margin-top:8px;padding:9px 14px;border-radius:999px;background:var(--b-lemon);font-size:12.5px;font-weight:700}
.done-hint .i{width:16px;height:16px;animation:nudge 1.2s ease-in-out infinite}
@keyframes nudge{50%{transform:translateX(4px)}}
.site-again{margin-top:6px;font-size:13px;font-weight:700;color:var(--b);text-decoration:underline;text-underline-offset:4px;padding:8px}

/* ---------- stage tabs ---------- */
.a-work{border:1px solid var(--line);border-radius:var(--r);background:var(--card);overflow:hidden;box-shadow:0 30px 60px -44px #14141266}
.a-steps{display:flex;gap:2px;padding:6px;border-bottom:1px solid var(--line);background:#f8f6f0;overflow-x:auto;scrollbar-width:none}
.a-steps::-webkit-scrollbar{display:none}
.a-steps button{position:relative;display:flex;align-items:center;gap:9px;flex:1 0 auto;min-height:50px;padding:7px 12px;border-radius:12px;text-align:left;transition:background .2s}
.a-steps button:hover{background:#efebe2}
.a-steps button[aria-selected=true]{background:var(--card);box-shadow:0 1px 0 var(--line),0 4px 14px -8px #14141244}
.a-steps button[aria-selected=true]::after{content:"";position:absolute;left:14px;right:14px;bottom:-7px;height:2px;border-radius:2px;background:var(--ink)}
.st-n{background:#e6e1d6;color:var(--ink);transition:background .3s,color .3s}
.a-steps button[aria-selected=true] .st-n{background:var(--ink);color:#fff}
.st-n-log{background:#e6e1d6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141412' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M9 7h10M9 12h10M9 17h10M5 7h.01M5 12h.01M5 17h.01'/%3E%3C/svg%3E") center/13px no-repeat}
.a-steps button[aria-selected=true] .st-n-log{background-color:var(--ink);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M9 7h10M9 12h10M9 17h10M5 7h.01M5 12h.01M5 17h.01'/%3E%3C/svg%3E")}
.st-t{display:flex;flex-direction:column;font-size:13.5px;font-weight:700;line-height:1.2;white-space:nowrap}
.st-t small{font-size:11px;font-weight:500;color:var(--muted)}
#tab-flow[data-state=running] .st-n{background:var(--live);color:#fff;animation:ring 1.4s infinite}
#tab-flow[data-state=waiting] .st-n{background:var(--warn);color:#fff}
@keyframes ring{0%{box-shadow:0 0 0 0 #4f82e688}100%{box-shadow:0 0 0 9px #4f82e600}}
.st-badge{display:inline-grid;place-items:center;min-width:24px;height:20px;padding:0 6px;border-radius:999px;background:var(--orange);color:#fff;font-size:11px;font-weight:800;animation:pop .4s var(--ease)}
.st-log{flex-grow:0!important}
.a-views{flex:1;min-height:0;position:relative}
.view{position:absolute;inset:0;display:flex;flex-direction:column;min-height:0;overflow:auto}
.view[hidden]{display:none}

/* ---------- guide bars ---------- */
.guide{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 12px 10px 14px;border-radius:12px;background:#eef3fd;border:1px solid #d5e1f8;font-size:13px}
.guide[hidden]{display:none}
.guide p{flex:1 1 260px}
.guide-btns{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- automation canvas ---------- */
#view-flow{padding:12px;gap:12px;overflow:hidden}
.now{display:flex;align-items:center;gap:12px;min-height:52px;padding:8px 10px 8px 14px;border-radius:14px;background:#fff;border:1px solid var(--line-2);flex:none}
.now-dot{width:10px;height:10px;border-radius:50%;background:#bdb7ab;flex:none}
.now[data-state=running] .now-dot{background:var(--live);animation:ring 1.4s infinite}
.now[data-state=waiting] .now-dot{background:var(--warn)}
.now[data-state=success] .now-dot,.now[data-state=recovered] .now-dot{background:var(--ok)}
.now-text{flex:1;font-size:13.5px;line-height:1.4;min-width:0}
.now-count{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:999px;background:#efebe2;font-size:11px;font-weight:700;vertical-align:1px}
.now-cta:empty{display:none}

.canvas{position:relative;flex:1 1 auto;min-height:calc(var(--world-h,280px) + 118px);border-radius:16px;overflow:hidden;color:var(--cv-text);
 background:radial-gradient(circle at 1px 1px,#ffffff17 1px,transparent 0) 0 0/22px 22px,var(--cv)}
.hud{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:8px;padding:12px 14px;font-size:12px;color:var(--cv-muted);z-index:2}
.hud-name{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--cv-text);margin-right:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hud-name .i{width:15px;height:15px;color:#ffb15c}
.hud-state{display:flex;gap:6px}
.hud-time{font-variant-numeric:tabular-nums;white-space:nowrap}
.hud-actions{position:absolute;right:12px;bottom:12px;display:flex;gap:6px;z-index:2;flex-wrap:wrap;justify-content:flex-end}
.hud-btn{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:6px 11px;border-radius:999px;background:#ffffff12;border:1px solid #ffffff1f;font-size:12px;font-weight:600;color:var(--cv-text);transition:background .2s}
.hud-btn:hover{background:#ffffff24}
.hud-btn .i{width:14px;height:14px}
.hud-btn-err .i{color:#ff8b6e}
.world{position:absolute;left:50%;top:max(50px,calc(50% - var(--world-h,280px)/2 - 14px));transform-origin:50% 0}
.edges{position:absolute;left:0;top:0;overflow:visible}
.edge-bg{fill:none;stroke:#3a3b35;stroke-width:2.4}
.edge{fill:none;stroke:transparent;stroke-width:2.6;transition:stroke .4s}
.edge.is-live{stroke:var(--live);stroke-dasharray:7 9;animation:dash .7s linear infinite}
.edge.is-done{stroke:#69b37e}
.edge.is-wait{stroke:#e0a443;stroke-dasharray:4 6}
.edge.is-err{stroke:#ff6b4f;stroke-dasharray:4 6;animation:dash 1.2s linear infinite}
@keyframes dash{to{stroke-dashoffset:-16}}
.packet{fill:#fff;filter:drop-shadow(0 0 6px #7fa8ff) drop-shadow(0 0 2px #fff)}

.node{position:absolute;display:flex;flex-direction:column;align-items:center;gap:9px;padding:0;color:var(--cv-text);text-align:center;transition:opacity .3s}
.n-tile{position:relative;width:64px;height:64px;border-radius:18px;display:grid;place-items:center;background:var(--cv-2);border:1.5px solid var(--cv-line);transition:border-color .3s,box-shadow .3s,transform .25s var(--ease),background .3s}
.node:hover .n-tile{border-color:#66675e;transform:translateY(-2px)}
.node.is-selected .n-tile{border-color:#e9e5da;box-shadow:0 0 0 4px #ffffff1f}
.n-ico{display:grid;place-items:center;color:var(--nc,#ddd);transition:transform .3s var(--ease)}
.n-ico .i{width:28px;height:28px;stroke-width:1.9}
.node[data-node=webhook]{--nc:#ff9a6e}.node[data-node=validate]{--nc:#ecd56b}.node[data-node=price]{--nc:#c2adf7}
.node[data-node=crm]{--nc:#8db4f5}.node[data-node=notify]{--nc:#83d6ec}.node[data-node=erp]{--nc:#b3d388}
.n-txt{display:flex;flex-direction:column;align-items:center;min-width:0;max-width:100%;padding:0 6px}
.n-type{display:none;font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#ffb15c;line-height:1.4}
body[data-mode=tech] .n-type{display:block}
.n-title{font-size:13px;line-height:1.22;font-weight:700;text-wrap:balance}
.n-sub{margin-top:3px;font-size:11px;line-height:1.25;color:var(--cv-muted);font-variant-numeric:tabular-nums}
.n-step{position:absolute;left:-9px;top:-9px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--cv);border:1.5px solid var(--cv-line);font-size:10px;font-weight:700;color:var(--cv-muted)}
.n-badge{position:absolute;right:-9px;top:-9px;width:22px;height:22px;border-radius:50%;display:none;place-items:center;color:#fff;box-shadow:0 0 0 3px var(--cv)}
.n-badge .i{width:13px;height:13px;stroke-width:2.8}
.n-bar{position:absolute;left:10px;right:10px;bottom:7px;height:3px;border-radius:3px;overflow:hidden;opacity:0;background:#ffffff14}
.n-bar::after{content:"";position:absolute;inset:0;width:40%;border-radius:3px;background:var(--live)}
.n-tile::before,.n-tile::after{content:"";position:absolute;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--cv);border:2px solid #55564f}
.n-tile::before{left:-7px}.n-tile::after{right:-7px}
.node[data-node=webhook] .n-tile::before,.node[data-node=notify] .n-tile::after,.node[data-node=erp] .n-tile::after{display:none}
/* states */
.node[data-status=running] .n-tile{border-color:var(--live);box-shadow:0 0 0 5px #4f82e630,0 0 36px #4f82e666}
.node[data-status=running] .n-ico{animation:breathe 1s ease-in-out infinite}
.node[data-status=running] .n-bar{opacity:1}
.node[data-status=running] .n-bar::after{animation:slide 1s ease-in-out infinite}
.node[data-status=running] .n-sub{color:#a9c6ff}
@keyframes slide{from{transform:translateX(-100%)}to{transform:translateX(250%)}}
@keyframes breathe{50%{transform:scale(.88)}}
.node[data-status=success] .n-tile{border-color:#3f7a50;background:#1d2620}
.node[data-status=success] .n-badge{display:grid;background:#3f9b5a;animation:pop .35s var(--ease)}
.node.had-retry .n-badge{background:#c98a1a}
.node[data-status=error] .n-tile{border-color:#ff6b4f;background:#2a1c18;box-shadow:0 0 0 5px #ff6b4f26,0 0 30px #ff6b4f44;animation:nodeshake .45s}
.node[data-status=error] .n-badge{display:grid;background:var(--err)}
.node[data-status=error] .n-bar{opacity:1}
.node[data-status=error] .n-bar::after{width:100%;background:#ff6b4f}
.node[data-status=error] .n-sub{color:#ff9c86}
.n-bar.count::after{animation:countdown var(--d) linear forwards}
@keyframes countdown{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@keyframes nodeshake{20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
.node[data-status=waiting] .n-tile{border-color:#e0a443;border-style:dashed}
.node[data-status=waiting] .n-badge{display:grid;background:#c98a1a}
.node[data-status=waiting] .n-ico{animation:breathe 2.4s ease-in-out infinite}
.node[data-status=waiting] .n-sub{color:#f3c473}
/* vertical (phones): rows instead of tiles */
.canvas.is-vertical .node{flex-direction:row;align-items:center;gap:12px;padding:0 12px 0 10px;text-align:left;border-radius:16px;background:#1b1c19;border:1px solid #2c2d29}
.canvas.is-vertical .n-tile{width:46px;height:46px;border-radius:13px;flex:none}
.canvas.is-vertical .n-ico .i{width:22px;height:22px}
.canvas.is-vertical .n-tile::before,.canvas.is-vertical .n-tile::after{display:none}
.canvas.is-vertical .n-txt{align-items:flex-start;padding:0}
.canvas.is-vertical .node[data-node=notify],.canvas.is-vertical .node[data-node=erp]{gap:9px;padding:0 8px}
.canvas.is-vertical .node[data-node=notify] .n-tile,.canvas.is-vertical .node[data-node=erp] .n-tile{width:40px;height:40px}
.canvas.is-vertical .node[data-node=notify] .n-title,.canvas.is-vertical .node[data-node=erp] .n-title{font-size:12px}
.canvas.is-vertical .hud-name{display:none}

/* ---------- inspector ---------- */
.inspector{flex:0 1 auto;min-height:150px;overflow:auto;padding:16px;border-radius:14px;background:#fff;border:1px solid var(--line-2)}
.ins-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ins-head>div{flex:1;min-width:0}
.ins-ico{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:#f1ede4;flex:none}
.ins-ico[data-status=running]{background:#e6eefc;color:var(--live)}.ins-ico[data-status=success]{background:var(--ok-bg);color:var(--ok)}
.ins-ico[data-status=error]{background:var(--err-bg);color:var(--err)}.ins-ico[data-status=waiting]{background:var(--warn-bg);color:var(--warn)}
.ins-kicker{font-size:11px;font-weight:600;color:var(--muted)}
.ins-head h3{font-size:17px;letter-spacing:-.01em}
.ins-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);gap:10px}
.ins-block{padding:12px 14px;border-radius:12px;background:#f7f5ef;font-size:13px;line-height:1.5}
.ins-main{background:#f1f5fd}
.ins-main.is-warn{background:var(--err-bg)}
.ins-label{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.ins-big{font-size:14px;font-weight:600;line-height:1.45}
.ins-data{margin-top:10px;display:grid;gap:4px}
.ins-data div{display:grid;grid-template-columns:minmax(90px,38%) 1fr;gap:10px;padding-top:4px;border-top:1px solid #0000000d;font-size:12.5px}
.ins-data dt{color:var(--muted)}.ins-data dd{font-weight:600;overflow-wrap:anywhere}
.ins-min{margin-top:8px;font-size:12px;font-weight:700;color:var(--ok)}.ins-min span{font-weight:500;color:var(--muted)}
.ins-meta{display:grid;grid-template-columns:repeat(3,auto) minmax(0,1fr);gap:8px 22px;margin-bottom:12px;font-size:12px}
.ins-meta dt{color:var(--muted)}.ins-meta dd{font-weight:700}
.ins-tabs{display:flex;gap:4px;margin-bottom:8px}
.ins-tabs button{padding:6px 12px;border-radius:8px;font-size:12px;font-weight:700;color:var(--muted)}
.ins-tabs button[aria-selected=true]{background:var(--ink);color:#fff}
.json{margin:0;padding:12px 14px;border-radius:10px;background:var(--cv);color:#e9e6dd;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;overflow:auto}
.j-k{color:#9cc2ff}.j-s{color:#b9e08f}.j-n{color:#ffb86b}.j-l{color:#f39ad0}.j-empty{color:#8f8c84;font-family:Manrope,sans-serif}

/* ---------- pills ---------- */
.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap;background:#ffffff1a;color:inherit}
.inspector .pill,.journal .pill{background:#efebe2;color:var(--muted)}
.pill-running{background:#4f82e633!important;color:#9cc0ff!important}
.inspector .pill-running,.journal .pill-running{background:#e6eefc!important;color:var(--live)!important}
.pill-success,.pill-recovered{background:#3f9b5a33!important;color:#8fd6a2!important}
.inspector .pill-success,.journal .pill-success,.journal .pill-recovered{background:var(--ok-bg)!important;color:var(--ok)!important}
.pill-waiting{background:#e0a44333!important;color:#f3c473!important}
.inspector .pill-waiting,.journal .pill-waiting{background:var(--warn-bg)!important;color:var(--warn)!important}
.pill-error,.pill-failed{background:#ff6b4f2e!important;color:#ff9c86!important}
.inspector .pill-error,.journal .pill-failed{background:var(--err-bg)!important;color:var(--err)!important}

/* ---------- CRM ---------- */
.crm{position:relative;display:flex;flex-direction:column;flex:1;min-height:0;background:#fbfaf6}
.crm-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--line-2);background:#fff}
.crm-brand{display:flex;align-items:center;gap:10px}
.crm-logo,.erp-logo{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#e6eefc;color:var(--live)}
.crm-brand b{font-size:16px;display:block}.crm-brand small{font-size:11.5px;color:var(--muted)}
.crm-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.crm-sum{font-size:12px;font-weight:600;color:var(--muted)}
.crm-guide{margin:12px 16px 0}
.crm-body{flex:1;min-height:0;overflow:auto;padding:12px 16px 16px}
.tbl-wrap{overflow:auto;border:1px solid var(--line-2);border-radius:12px;background:#fff}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{position:sticky;top:0;z-index:1;background:#f7f5ef;text-align:left;font-size:11px;font-weight:700;color:var(--muted);padding:9px 12px;border-bottom:1px solid var(--line-2);white-space:nowrap}
.tbl td{padding:10px 12px;border-bottom:1px solid #f0ece3;vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl td small{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--muted);margin-top:2px}
.tbl td small .i{width:13px;height:13px}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl tbody tr[data-order],.tbl tbody tr[data-doc]{cursor:pointer;transition:background .2s}
.tbl tbody tr[data-order]:hover,.tbl tbody tr[data-doc]:hover{background:#faf8f2}
.o-no{font-variant-numeric:tabular-nums}
tr.is-auto td:first-child{box-shadow:inset 3px 0 0 var(--live)}
.is-new{animation:newrow 2.6s ease-out}
@keyframes newrow{0%,30%{background:#fff5c9}100%{background:transparent}}
.mgr{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.ava{width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;background:var(--c);color:#fff;font-size:11px;font-weight:800;flex:none}
.st-select select{appearance:none;-webkit-appearance:none;border:0;border-radius:999px;padding:5px 26px 5px 11px;font-size:12px;font-weight:700;cursor:pointer;background:var(--sb) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141412' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") right 8px center/12px no-repeat;color:var(--sc)}
.st-new,.st-select .st-new{--sb:#e6eefc;--sc:#2c5cc5}.st-contact{--sb:var(--warn-bg);--sc:#8a5a0c}.st-confirmed{--sb:var(--ok-bg);--sc:var(--ok)}.st-done{--sb:#ebe8e1;--sc:#4b4842}
.st{display:inline-flex;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;background:var(--sb);color:var(--sc)}
.st-dot{width:9px;height:9px;border-radius:50%;background:var(--sc)}
.in-erp{color:var(--ok)!important;font-weight:700}
.board{display:grid;grid-template-columns:repeat(4,minmax(200px,1fr));gap:10px;min-height:100%}
.col{display:flex;flex-direction:column;min-height:240px;padding:8px;border-radius:14px;background:#f1eee6;transition:background .2s,box-shadow .2s}
.col.is-over{background:#e8eefb;box-shadow:inset 0 0 0 2px var(--live)}
.col header{display:flex;align-items:center;gap:7px;padding:4px 6px 10px;font-size:13px}
.col-n{padding:0 7px;border-radius:999px;background:#fff;font-size:11px;font-weight:700}
.col header small{margin-left:auto;font-size:11px;color:var(--muted);font-weight:600;white-space:nowrap}
.col-list{display:flex;flex-direction:column;gap:8px}
.col-empty{font-size:12px;color:var(--muted);text-align:center;padding:16px 0}
.card{position:relative;padding:11px 12px;border-radius:12px;background:#fff;border:1px solid #e7e2d7;cursor:grab;user-select:none;transition:box-shadow .2s,transform .2s var(--ease),opacity .2s}
.card:hover{box-shadow:0 8px 20px -14px #14141288;transform:translateY(-1px)}
.card.is-auto{border-left:3px solid var(--live)}
.card.is-dragging{opacity:.35}
.card.ghost{position:fixed;z-index:1000;pointer-events:none;box-shadow:0 24px 40px -18px #14141288;cursor:grabbing;margin:0}
.card-top{display:flex;justify-content:space-between;font-size:12px}.card-top small{color:var(--muted)}
.card-name{font-weight:700;font-size:13.5px;margin-top:4px}
.card-svc{font-size:12px;color:var(--muted);margin-top:2px}
.card-foot{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13px}
.card-foot b{margin-right:auto;font-variant-numeric:tabular-nums}
.card-ph{display:inline-flex;align-items:center;gap:3px;font-size:11px;color:var(--muted)}.card-ph .i{width:13px;height:13px}
.card-next{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:#f1eee6;transition:background .2s}
.card-next:hover{background:var(--ink);color:#fff}.card-next .i{width:14px;height:14px}
.drawer-wrap{position:absolute;inset:0;z-index:5}
.drawer-shade{position:absolute;inset:0;background:#14141224;animation:fade .25s}
.drawer{position:absolute;top:0;right:0;bottom:0;width:min(440px,100%);display:flex;flex-direction:column;background:#fff;box-shadow:-24px 0 50px -30px #14141288;animation:drawer .35s var(--ease)}
@keyframes drawer{from{transform:translateX(40px);opacity:0}}
@keyframes fade{from{opacity:0}}
.dr-head{display:flex;align-items:center;gap:10px;padding:14px 14px 12px 18px;border-bottom:1px solid var(--line-2)}
.dr-head>div{flex:1}
.dr-kicker{font-size:11px;color:var(--muted);font-weight:600}
.dr-head h3{font-size:20px;letter-spacing:-.01em}
.icon-btn{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;transition:background .2s}
.icon-btn:hover{background:#f1eee6}
.dr-scroll{flex:1;overflow:auto;padding:4px 18px 20px}
.dr-client{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid #f0ece3}
.ava-lg{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;font-weight:800;flex:none}
.dr-client b{font-size:15px}
.dr-client p{display:flex;align-items:center;gap:6px;font-size:13px;margin-top:3px}
.dr-client p .i{width:15px;height:15px;color:var(--muted)}
.dr-client small{display:block;margin-top:6px;font-size:11.5px;color:var(--muted)}
.dr-sec{padding:14px 0;border-bottom:1px solid #f0ece3}
.dr-sec:last-child{border-bottom:0}
.dr-sec h4{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.dr-svc{font-weight:700}.dr-extra{font-size:13px;color:var(--muted);margin-top:2px}
.dr-muted{font-size:12.5px;color:var(--muted);margin-top:6px}
.dr-photos{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}
.dr-photos img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block}
.dr-lines{width:100%;border-collapse:collapse;font-size:13px}
.dr-lines td{padding:5px 0;vertical-align:top}.dr-lines .num{text-align:right;white-space:nowrap;padding-left:12px;font-variant-numeric:tabular-nums}
.dr-total td{padding-top:9px;border-top:1px solid var(--line-2);font-weight:800;font-size:15px}
.dr-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dr-controls .btn-primary,.dr-controls .btn-ghost{grid-column:1/-1}
.dr-field{display:flex;flex-direction:column;gap:4px;font-size:11.5px;font-weight:700;color:var(--muted)}
.dr-field select{appearance:none;-webkit-appearance:none;min-height:40px;padding:8px 30px 8px 12px;border:1px solid var(--line);border-radius:10px;font-size:13px;font-weight:700;color:var(--ink);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141412' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") right 10px center/13px no-repeat;cursor:pointer}
.dr-field select.st-new,.dr-field select.st-contact,.dr-field select.st-confirmed,.dr-field select.st-done{background-color:var(--sb);color:var(--sc);border-color:transparent}
.dr-hist{position:relative;display:grid;gap:10px;padding-left:16px}
.dr-hist::before{content:"";position:absolute;left:4px;top:6px;bottom:6px;width:1.5px;background:var(--line)}
.dr-hist li{position:relative;font-size:13px}
.dr-hist li::before{content:"";position:absolute;left:-15.5px;top:6px;width:8px;height:8px;border-radius:50%;background:#fff;border:2px solid var(--ink)}
.dr-hist time{font-size:11px;color:var(--muted)}

/* ---------- chat ---------- */
#view-chat{padding:12px}
.chat-layout{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,300px);gap:12px}
.chat{display:flex;flex-direction:column;min-height:0;border-radius:16px;overflow:hidden;border:1px solid var(--line-2);background:#dfe6d6}
.chat-head{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#fff;border-bottom:1px solid #e3e6dc}
.chat-head>div{flex:1;min-width:0}.chat-head b{display:block;font-size:14px}.chat-head small{font-size:11.5px;color:var(--muted)}
.chat-badge{font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:999px;background:#efebe2;color:var(--muted)}
.bot-ava{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,#0d6e5b,#34a083);color:#fff;font-weight:800;flex:none}
.bot-ava.sm{width:30px;height:30px;font-size:12px;align-self:flex-end}
.chat-log{flex:1;min-height:0;overflow:auto;padding:14px 12px;display:flex;flex-direction:column;gap:8px;
 background:radial-gradient(circle at 20% 30%,#ffffff40 0 2px,transparent 3px) 0 0/34px 34px,linear-gradient(160deg,#d8e3cc,#e4e2cf)}
.chat-day{text-align:center;margin:4px 0}.chat-day span{display:inline-block;padding:3px 10px;border-radius:999px;background:#00000024;color:#fff;font-size:11px;font-weight:700}
.msg{display:flex;gap:8px;max-width:440px}
.bubble{position:relative;padding:10px 12px 18px;border-radius:16px 16px 16px 4px;background:#fff;font-size:13px;line-height:1.4;box-shadow:0 1px 1px #0000001a;min-width:0}
.msg.is-old .bubble{opacity:.8}
.msg-kicker{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:800;color:#0d6e5b;margin-bottom:4px}.msg-kicker .i{width:15px;height:15px}
.msg-name{font-weight:800;font-size:14px}
.msg-svc{margin-top:6px;font-weight:600}
.msg-sum{margin-top:6px;font-size:16px;font-weight:800}.msg-sum small{font-size:11px;font-weight:600;color:var(--muted)}
.msg-mgr{margin-top:4px;font-size:12px;color:var(--muted)}.msg-mgr b{color:var(--ink)}
.msg-photos{display:grid;gap:3px;margin-top:8px;border-radius:10px;overflow:hidden}
.msg-photos.n2,.msg-photos.n4{grid-template-columns:1fr 1fr}.msg-photos.n3{grid-template-columns:1fr 1fr 1fr}
.msg-photos img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.msg-time{position:absolute;right:10px;bottom:4px;font-size:10.5px;color:#7d8a7a}
.msg-actions{display:grid;grid-template-columns:1fr 1fr;gap:4px;max-width:440px;margin:-2px 0 4px 38px}
.kb{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:7px 10px;border-radius:10px;background:#ffffffb3;backdrop-filter:blur(4px);font-size:12.5px;font-weight:700;color:#0d4f42;transition:background .2s,transform .15s}
.kb:hover:not(:disabled){background:#fff}.kb:active:not(:disabled){transform:scale(.97)}
.kb:disabled{opacity:.55}
.kb .i{width:15px;height:15px}
.kb-main{grid-column:1/-1;background:#0d6e5b;color:#fff}.kb-main:hover:not(:disabled){background:#0b5c4c}
.msg-done{grid-column:1/-1;display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:10px;background:#ffffffb3;font-size:12.5px;font-weight:700;color:var(--ok)}
.msg-sys{align-self:center;max-width:92%}
.msg-sys p{position:relative;display:block;padding:6px 12px;border-radius:12px;background:#ffffffcc;font-size:12px;text-align:center;line-height:1.5}
.msg-sys .i{width:14px;height:14px;display:inline-block;vertical-align:-2px;margin-right:5px}
.msg-sys .msg-time{position:static;margin-left:4px}
.msg-sys.is-ok .i{color:var(--ok)}.msg-sys.is-warn p{background:#fff1d6}.msg-sys.is-warn .i{color:var(--warn)}
.chat-input{display:flex;align-items:center;justify-content:space-between;margin:8px;padding:10px 14px;border-radius:999px;background:#fff;color:#a7a399;font-size:13px}
.chat-side{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:16px;background:#fff;border:1px solid var(--line-2);overflow:auto}
.chat-side h3{font-size:16px;line-height:1.3;letter-spacing:-.01em}
.side-list{display:grid;gap:10px}
.side-list li{display:flex;gap:9px;font-size:13px;line-height:1.4}
.side-list .i{color:#0d6e5b;margin-top:1px}
.side-note{font-size:12px;color:var(--muted)}
.chat-guide{margin-top:auto}

/* ---------- 1C-style accounting ---------- */
.erp{display:flex;flex-direction:column;flex:1;min-height:0;background:#f7f6f2;font-size:13px}
.erp-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;background:#f1e8c8;border-bottom:1px solid #e0d4a8}
.erp-logo{background:#fff8dc;color:#8a6a10}
.erp-top b{display:block;font-size:15px}.erp-top small{font-size:11.5px;color:#7a6c43}
.erp-flag{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:#fff8e3;border:1px solid #e3d29b;font-size:11.5px;font-weight:700;color:#7a5d0c}
.erp-flag .i{width:14px;height:14px}
.erp-guide{margin:12px 16px 0;background:var(--ok-bg);border-color:#cfe3cf}
.erp-body{flex:1;min-height:0;display:grid;grid-template-columns:200px minmax(0,1fr)}
.erp-nav{display:flex;flex-direction:column;gap:2px;padding:12px 8px 12px 12px;border-right:1px solid var(--line-2)}
.erp-nav button{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;border-radius:8px;font-size:13px;font-weight:600;text-align:left;color:#4b4842}
.erp-nav button:hover{background:#eeeae0}
.erp-nav button[aria-selected=true]{background:#fff;color:var(--ink);box-shadow:0 1px 3px #0000001a}
.erp-n{min-width:22px;padding:1px 6px;border-radius:999px;background:#e6e1d6;font-size:11px;text-align:center}
.erp-main{min-width:0;overflow:auto;padding:12px 16px 16px}
.erp-toolbar{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}.erp-toolbar b{font-size:14px}.erp-toolbar span{font-size:12px;color:var(--muted)}
.tbl-erp td,.tbl-erp th{padding:7px 10px}
.tbl-erp tr.is-sel{background:#fff6d6!important}
.posted{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;background:var(--ok-bg);color:var(--ok)}.posted .i{width:13px;height:13px;stroke-width:2.6}
.erp-pick{display:flex;align-items:center;gap:6px;margin-top:12px;font-size:12px;color:var(--muted)}.erp-pick .i{width:14px;height:14px;transform:rotate(-90deg)}
.doc{margin-top:14px;padding:14px 16px;border-radius:12px;background:#fff;border:1px solid #e0d9c8;animation:fade .3s}
.doc-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.doc-head h3{flex:1;font-size:15px}
.doc-state{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;background:var(--ok-bg);color:var(--ok);font-size:11.5px;font-weight:700}.doc-state .i{width:13px;height:13px}
.doc-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;margin-bottom:12px}
.doc-fields div{display:flex;flex-direction:column;gap:2px;padding:7px 10px;border:1px solid #ece6d6;border-radius:8px;background:#fdfcf8}
.doc-fields .wide{grid-column:1/-1}
.doc-fields dt{font-size:10.5px;color:var(--muted);font-weight:700}.doc-fields dd{font-weight:600}
.doc-lines tfoot td{padding:9px 10px;font-weight:800;border-top:1px solid var(--line-2);background:#f7f5ef}
.doc-lines tfoot td:first-child{text-align:right}
.doc-sub{margin:14px 0 8px;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.doc-map{display:grid;gap:5px}
.doc-map li{display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);align-items:center;gap:8px;padding:7px 10px;border-radius:8px;background:#f7f5ef;font-size:12.5px}
.doc-map .i{width:15px;height:15px;color:var(--muted)}
.xlog{display:grid;gap:6px}
.xlog li{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:#fff;border:1px solid var(--line-2)}
.xlog li>div{flex:1}.xlog b{display:block}.xlog small{font-size:11.5px;color:var(--muted)}
.x-ok{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--ok-bg);color:var(--ok)}.x-ok .i{width:15px;height:15px}
.xlog code{font-size:11px;padding:3px 7px;border-radius:6px;background:var(--ok-bg);color:var(--ok)}

/* ---------- journal ---------- */
.journal{flex:1;min-height:0;display:grid;grid-template-columns:240px minmax(0,1fr)}
.runs{border-right:1px solid var(--line-2);padding:14px 10px;overflow:auto}
.j-title{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:0 6px 8px}
.run-list{display:grid;gap:3px}
.run-item{width:100%;display:flex;gap:10px;align-items:flex-start;padding:9px 10px;border-radius:10px;text-align:left;transition:background .2s}
.run-item:hover{background:#f1eee6}.run-item[aria-pressed=true]{background:#fff;box-shadow:0 1px 4px #00000014}
.run-item b{display:block;font-size:13px}.run-item small{font-size:11.5px;color:var(--muted)}
.run-dot{width:9px;height:9px;border-radius:50%;margin-top:5px;flex:none;background:#bdb7ab}
.rd-running{background:var(--live)}.rd-waiting{background:var(--warn)}.rd-success,.rd-recovered{background:var(--ok)}.rd-failed,.rd-stopped{background:var(--err)}
.entries{display:flex;flex-direction:column;min-width:0;padding:14px 16px;overflow:auto}
.j-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}.j-head b{font-size:15px}.j-head small{color:var(--muted);font-size:12px}
.entry-list{display:grid;gap:2px}
.entry-list li{display:flex;gap:10px;padding:8px 6px;border-bottom:1px solid #f0ece3;animation:fade .3s}
.entry-list p{font-size:13.5px}.entry-list small{font-size:11.5px;color:var(--muted)}
.e-ico{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;flex:none;background:#efebe2;color:var(--muted)}.e-ico .i{width:15px;height:15px}
.lv-ok .e-ico{background:var(--ok-bg);color:var(--ok)}.lv-warn .e-ico{background:var(--warn-bg);color:var(--warn)}.lv-error .e-ico{background:var(--err-bg);color:var(--err)}
.entry-list.is-tech{gap:0;padding:10px 12px;border-radius:12px;background:var(--cv)}
.entry-list.is-tech li{padding:3px 0;border:0}
.entry-list.is-tech code{font:11.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#d6d2c8;white-space:pre-wrap;overflow-wrap:anywhere}
.entry-list.is-tech .t{color:#8f8c84}.entry-list.is-tech .lv{color:#9cc2ff;white-space:pre}.entry-list.is-tech .nd{color:#ffb15c;white-space:pre}
.entry-list.is-tech .lv-ok .lv{color:#8fd6a2}.entry-list.is-tech .lv-warn .lv{color:#f3c473}.entry-list.is-tech .lv-error .lv{color:#ff9c86}
.j-empty{padding:14px 8px;font-size:13px;color:var(--muted)}
.entry-list.is-tech .j-empty{color:#8f8c84}

/* ---------- «how it will be for you» & footer ---------- */
.a-real{margin:56px var(--m) 0;padding:36px 0 8px;border-top:1px solid var(--line)}
.a-real h2{font-family:Oswald,sans-serif;font-weight:700;font-size:clamp(32px,4vw,60px);line-height:1;letter-spacing:-.02em;margin:10px 0 26px;max-width:16ch}
.real-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;counter-reset:s}
.real-steps li{padding:18px;border-radius:16px;background:var(--card);border:1px solid var(--line);counter-increment:s}
.real-steps li::before{content:"0" counter(s);display:block;font-family:Oswald,sans-serif;font-size:26px;color:var(--orange);margin-bottom:12px}
.real-steps li:nth-child(2)::before{color:#6b9a35}.real-steps li:nth-child(3)::before{color:#4d7fe0}
.real-steps b{font-size:16px}.real-steps p{margin-top:6px;color:var(--muted);font-size:14px;line-height:1.5}
.real-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.a-foot{margin:48px var(--m) 0;padding:20px 0 calc(28px + env(safe-area-inset-bottom));border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:24px;font-size:12px;color:var(--muted)}
.a-foot p{max-width:820px;line-height:1.55}

/* ---------- toasts ---------- */
.toasts{position:fixed;right:20px;bottom:20px;z-index:60;display:flex;flex-direction:column;gap:8px;width:min(400px,calc(100vw - 32px));pointer-events:none}
.toast{position:relative;display:flex;align-items:center;gap:10px;padding:12px 10px 12px 14px;border-radius:14px;background:var(--ink);color:#fff;box-shadow:0 18px 40px -18px #000000aa;font-size:13px;line-height:1.4;pointer-events:auto;overflow:hidden;animation:toastin .4s var(--ease)}
.toast.out{animation:toastout .26s ease-in forwards}
@keyframes toastin{from{opacity:0;transform:translateY(14px) scale(.97)}}
@keyframes toastout{to{opacity:0;transform:translateX(30px)}}
.toast p{flex:1}
.toast-ico{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:#ffffff1c;flex:none}.toast-ico .i{width:16px;height:16px}
.toast-ok .toast-ico{background:#3f9b5a}.toast-err .toast-ico{background:var(--err)}
.toast-btn{padding:7px 11px;border-radius:999px;background:#fff;color:var(--ink);font-size:12px;font-weight:800;white-space:nowrap}
.toast-x{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:#ffffff99}.toast-x:hover{color:#fff;background:#ffffff14}.toast-x .i{width:14px;height:14px}
.toast-timer{position:absolute;left:0;bottom:0;height:3px;width:100%;background:#ff8b6e;transform-origin:left;animation:timer var(--d) linear forwards}
@keyframes timer{to{transform:scaleX(0)}}

/* ---------- responsive ---------- */

/* ---------- live mode ---------- */
.a-live{margin:0 var(--m) 22px;border-radius:20px;border:1px solid var(--line);background:var(--card)}
.a-live:empty{display:none}
.a-live.is-off{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 24px;background:linear-gradient(110deg,#e9f6e4 0%,var(--card) 55%)}
.live-pitch h2{font-family:Oswald,sans-serif;font-weight:700;font-size:clamp(24px,2.4vw,34px);line-height:1.05;letter-spacing:-.01em;margin:6px 0 8px}
.live-pitch p:last-child{color:var(--muted);max-width:720px;font-size:14.5px}
.live-pitch .a-eyebrow{display:flex;align-items:center;gap:8px;color:#1f7a3f}
.live-dot{width:9px;height:9px;border-radius:50%;background:#25a55a;box-shadow:0 0 0 0 #25a55a88;animation:livePulse 1.8s infinite;flex:none}
@keyframes livePulse{70%{box-shadow:0 0 0 9px #25a55a00}100%{box-shadow:0 0 0 0 #25a55a00}}
.a-live.is-off .btn-primary{background:#1f7a3f;flex:none}
.a-live.is-on{padding:16px 20px 18px;border-color:#b9dcb8;box-shadow:0 18px 40px -30px #1f7a3f88}
.live-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--line-2)}
.live-head h2{font-size:16px;font-weight:800}
.live-head small{color:var(--muted);font-size:13px;flex:1}
.link-btn{color:var(--ink);text-decoration:underline;text-underline-offset:3px;font-size:13px;font-weight:600;padding:2px 0}
.link-btn:disabled{opacity:.4;text-decoration:none}
.live-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,300px);gap:20px;padding-top:14px;align-items:start}
.live-steps{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr);gap:12px}
.ls{display:flex;gap:10px;padding:12px;border-radius:14px;border:1px solid var(--line-2);opacity:.55;transition:opacity .3s,border-color .3s,background .3s}
.ls.is-active{opacity:1;border-color:#9fd09d;background:#f3faf1}
.ls.is-done{opacity:1}
.ls-n{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-size:12px;font-weight:800}
.ls.is-active .ls-n{background:#1f7a3f}
.ls.is-done .ls-n{background:var(--ok-bg);color:var(--ok)}.ls-n .i{width:15px;height:15px}
.ls b{display:block;font-size:14px;margin:3px 0 4px}
.ls p{font-size:13px;color:var(--muted);line-height:1.45}.ls p b{display:inline;color:var(--ink);margin:0}
.ls-row{display:flex;gap:14px;align-items:center;margin-top:6px}
.qr{flex:none;width:118px;padding:4px;border-radius:10px;background:#fff;border:1px solid var(--line)}
.qr svg{display:block;width:100%;height:auto}
.ls-how{display:grid;gap:7px;justify-items:start}
.ls-how b{white-space:nowrap}
.ls-code{font-family:Oswald,sans-serif;font-size:24px;letter-spacing:.04em;color:var(--ink)!important;line-height:1}
.ls-how .btn-primary{background:#1f7a3f}
.ls-wait{display:flex;align-items:center;gap:7px;font-size:12px!important}
.ls-err{color:var(--err)!important;margin-bottom:8px}
.spin{width:12px;height:12px;border-radius:50%;border:2px solid #1f7a3f33;border-top-color:#1f7a3f;animation:spin .9s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(1turn)}}
.live-sheet{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;align-items:center;padding:14px;border-radius:14px;background:#eef7ee;border:1px solid #cfe7cd}
.live-sheet b{font-size:14px}.live-sheet p{font-size:12.5px;color:var(--muted)}
.live-sheet .btn-ghost,.sheet-soon{grid-column:1/-1;margin-top:8px;justify-self:start}
.sheet-soon{font-size:12px;color:var(--muted)}
.sheet-ico{grid-row:span 2;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#1f7a3f;color:#fff}
.msg-sys.is-live p{background:#e9f6e4;color:#1f5f33}
.via-wa{display:inline-block;padding:0 6px;border-radius:6px;background:#25a55a;color:#fff;font-size:11px;font-weight:700}

/* ---------- plain words ---------- */
.real-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:34px}
.real-card{padding:20px;border-radius:16px;background:var(--card);border:1px solid var(--line)}
.real-card h3{font-size:18px;margin:12px 0 6px}.real-card p{color:var(--muted);font-size:14px;line-height:1.5}
.rc-tag{display:inline-block;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;background:var(--line-2);color:var(--muted)}
.rc-tag.is-real{background:#dff1dc;color:#1f6b38}
.real-sub{font-family:Oswald,sans-serif;font-size:clamp(22px,2.2vw,30px);line-height:1.1;margin-bottom:14px}
.real-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:34px}
.real-options article{position:relative;padding:20px;border-radius:16px;border:1px solid var(--line)}
.real-options article.is-pick{border:2px solid #1f7a3f;background:#f3faf1}
.real-options b{font-size:16px}.real-options p{margin-top:6px;color:var(--muted);font-size:14px;line-height:1.5}
.opt-pick{position:absolute;top:-11px;left:16px;padding:2px 9px;border-radius:999px;background:#1f7a3f;color:#fff;font-size:11px;font-weight:700}

@media (max-width:1280px){
 .ins-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .ins-main{grid-column:1/-1}
}
@media (max-width:1099px){
 .hint-wide{display:none}.hint-narrow{display:inline}
 .done-hint .i{transform:rotate(90deg);animation:none}
 .a-intro{grid-template-columns:minmax(0,1fr)}.a-controls{align-items:flex-start;flex-direction:row;flex-wrap:wrap}
 .a-stage{grid-template-columns:minmax(0,1fr);height:auto;min-height:0;gap:26px}
 .browser{flex:none}.site{overflow:visible;flex:none}
 .site-total{bottom:0}
 .a-work{overflow:visible}
 .a-steps{position:sticky;top:0;z-index:20;border-radius:var(--r) var(--r) 0 0}
 .a-views{flex:none}
 .view{position:static;overflow:visible}
 #view-flow{overflow:visible}
 .canvas{flex:none;height:calc(var(--world-h,280px) + 118px)}
 .inspector{overflow:visible}
 .crm{min-height:560px}.crm-body{overflow:visible}
 .tbl-wrap{max-width:100%}
 .drawer-wrap{position:fixed;z-index:40}
 .drawer{width:min(480px,100%)}
 .chat{height:min(640px,80svh)}
 .erp-main{overflow:visible}
 .journal{min-height:420px}
}
@media (max-width:760px){
 .a-header{height:64px}.a-nav{gap:16px}.a-nav a:first-child{display:none}
 .a-intro h1{font-size:clamp(34px,10vw,52px)}
 .a-lead{font-size:15px}
 .seg button{padding:8px 12px;font-size:12.5px}
 .a-metrics{grid-template-columns:1fr 1fr}
 .metric{flex-direction:column;align-items:flex-start;gap:4px;padding:12px 0}
 .metric+.metric{padding-left:0;border-left:0}
 .metric:nth-child(2n){padding-left:14px;border-left:1px solid var(--line)}
 .metric:nth-child(n+3){border-top:1px solid var(--line)}
 .ins-grid{grid-template-columns:1fr}
 .ins-meta{grid-template-columns:repeat(3,auto)}.ins-meta div:last-child{grid-column:1/-1}
 .now{flex-wrap:wrap}.now-cta{width:100%}.now-cta .btn-primary{width:100%}
 #view-flow,#view-chat{padding:8px}
 .canvas.is-vertical .hud-actions{position:static;padding:0 12px 12px;justify-content:stretch;flex-direction:column}
 .canvas.is-vertical .hud-actions .hud-btn{justify-content:center}
 .canvas.is-vertical{height:auto;padding-bottom:8px}
 .canvas.is-vertical .world{position:relative;left:auto;top:auto;margin:54px 14px 14px;transform:none!important}
 .crm-bar{padding:12px}.crm-body{padding:10px 12px 14px}.crm-guide{margin:10px 12px 0}
 .tbl-crm-cards{}
 .crm .tbl thead{display:none}
 .crm .tbl,.crm .tbl tbody{display:block}
 .crm .tbl tr{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:12px;border-bottom:1px solid #f0ece3}
 .crm .tbl td{display:block;padding:0;border:0}
 .crm .tbl tr.is-auto{box-shadow:inset 3px 0 0 var(--live)}.crm .tbl tr.is-auto td:first-child{box-shadow:none}
 .crm .tbl td:nth-child(1){grid-column:1}.crm .tbl td:nth-child(4){grid-column:2;grid-row:1;text-align:right}
 .crm .tbl td:nth-child(2),.crm .tbl td:nth-child(3){grid-column:1/-1}
 .crm .tbl td:nth-child(5){grid-column:1}.crm .tbl td:nth-child(6){grid-column:2;grid-row:4}
 .crm .tbl td:nth-child(6){display:flex;flex-direction:column;align-items:flex-end}
 .board{grid-template-columns:repeat(4,minmax(240px,82%));overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
 .col{scroll-snap-align:start}
 .chat-layout{grid-template-columns:1fr}
 .msg-actions{margin-left:0}
 .erp-body{grid-template-columns:1fr}
 .erp-nav{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line-2);padding:8px}
 .erp-nav button{white-space:nowrap}
 .erp-main{padding:12px}
 .doc-fields{grid-template-columns:1fr}
 .doc-map li{grid-template-columns:1fr;gap:2px}.doc-map .i{transform:rotate(90deg)}
 .journal{grid-template-columns:1fr}
 .runs{border-right:0;border-bottom:1px solid var(--line-2)}
 .run-list{grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);overflow-x:auto}
 .real-steps{grid-template-columns:1fr}
 .a-foot{flex-direction:column}
 .toasts{right:16px;left:16px;bottom:16px;width:auto}
 .site-hero h2{font-size:23px}
 .contacts{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
 .n-bar.count::after,.toast-timer{animation:none!important}
}

@media (max-width:1099px){.live-body{grid-template-columns:1fr}.live-steps{grid-template-columns:1fr}}
@media (max-width:760px){
 .a-live.is-off{flex-direction:column;align-items:stretch;padding:18px}
 .a-live.is-on{padding:14px}
 .real-grid,.real-options{grid-template-columns:1fr}
 .ls-code{font-size:22px}
}
@media (prefers-reduced-motion:reduce){.live-dot,.spin{animation:none}}