/* Онлайн-чат: работает на сайте, в отчёте и кабинете, поэтому берёт цвета любой из трёх страниц. */
#vsc { --c-ink: var(--vs-text, var(--ink, var(--t, #13201c))); --c-mute: var(--vs-text2, var(--mute, var(--t2, #56635d))); --c-line: var(--vs-border, var(--line, var(--b, #d9ddd3)));
  --c-card: var(--vs-card, var(--card, var(--c, #fff))); --c-chip: var(--vs-chip, var(--chip, #eceee7)); --c-brand: #0b6b55;
  position: fixed; right: 16px; bottom: 16px; z-index: 900; font: 14px/20px Onest, "Segoe UI", Roboto, system-ui, sans-serif; color: var(--c-ink); }
#vsc * { box-sizing: border-box; }
#vsc.lift { bottom: 104px; }
.vsc-btn { position: relative; display: flex; align-items: center; gap: 8px; min-height: 56px; padding: 0 22px 0 16px; border: 0; border-radius: 28px; background: var(--c-brand); color: #fff; font: 600 14px/20px inherit; font-family: inherit; cursor: pointer; box-shadow: 0 6px 20px rgba(19,32,28,.25); }
.vsc-dot { position: absolute; top: -2px; right: -2px; width: 14px; height: 14px; border-radius: 50%; background: #f0b43c; border: 2px solid #fff; }
.vsc-dot[hidden], .vsc-box[hidden], .vsc-contact[hidden] { display: none; }
.vsc-box { position: absolute; right: 0; bottom: 68px; display: flex; flex-direction: column; width: 360px; max-width: calc(100vw - 32px); height: min(520px, calc(100vh - 118px)); background: var(--c-card); border: 1px solid var(--c-line); border-radius: 16px; overflow: hidden; box-shadow: 0 12px 32px rgba(19,32,28,.22); }
.vsc-head { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--c-brand); color: #fff; }
.vsc-ava { position: relative; flex: none; width: 40px; height: 40px; }
.vsc-ava svg { display: block; border-radius: 50%; }
.vsc-ava::after { content: ""; position: absolute; right: -1px; bottom: -1px; width: 12px; height: 12px; border-radius: 50%; background: #4cd38a; border: 2px solid var(--c-brand); }
.vsc-who { flex: 1; min-width: 0; }
.vsc-ico { flex: none; }
@media (max-width: 639px) { .vsc-btn { width: 56px; padding: 0; justify-content: center; } .vsc-lbl { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } }
.vsc-head b { font-size: 15px; } .vsc-head span { display: block; font-size: 12px; line-height: 16px; opacity: .85; }
.vsc-x { width: 40px; height: 40px; margin-right: -8px; border: 0; background: none; color: #fff; font-size: 22px; cursor: pointer; }
.vsc-list { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.vsc-m { max-width: 85%; padding: 8px 12px; border-radius: 12px; white-space: pre-wrap; overflow-wrap: anywhere; background: var(--c-chip); align-self: flex-start; }
.vsc-m.in { align-self: flex-end; background: var(--c-brand); color: #fff; }
.vsc-m.auto { color: var(--c-mute); }
.vsc-m i { display: block; margin-bottom: 2px; font-style: normal; font-size: 12px; line-height: 16px; font-weight: 600; color: var(--c-mute); }
.vsc-m.out i { color: var(--c-brand); }
.vsc-typing { display: flex; gap: 4px; padding: 12px 14px; }
.vsc-typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--c-mute); opacity: .35; animation: vsc-blink 1.2s infinite; }
.vsc-typing span:nth-child(2) { animation-delay: .2s; } .vsc-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes vsc-blink { 40% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .vsc-typing span { animation: none; opacity: .7; } }
.vsc-human { align-self: center; margin: 0 12px 8px; padding: 6px 12px; border: 1px solid var(--c-line); border-radius: 16px; background: none; color: var(--c-brand); font: 600 13px/18px inherit; font-family: inherit; cursor: pointer; }
.vsc-human[hidden] { display: none; }
.vsc-contact { display: flex; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--c-line); }
.vsc-form { display: flex; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--c-line); align-items: flex-end; }
#vsc input[type=text], #vsc textarea { flex: 1; min-width: 0; padding: 9px 12px; border: 1px solid var(--c-line); border-radius: 10px; background: var(--c-card); color: var(--c-ink); font: 16px/22px inherit; font-family: inherit; resize: none; }
.vsc-send { min-height: 42px; padding: 0 14px; border: 0; border-radius: 10px; background: var(--c-brand); color: #fff; font-family: inherit; font-weight: 600; cursor: pointer; }
.vsc-send:disabled { opacity: .6; cursor: default; }
.vsc-note { padding: 0 12px 8px; font-size: 12px; line-height: 16px; color: var(--c-mute); }
.vsc-note a { color: inherit; }
.vsc-err { padding: 0 12px 6px; font-size: 13px; color: #b3381f; }
.vsc-err:empty { display: none; }
.vsc-hp { position: absolute; left: -9999px; }
@media print { #vsc { display: none; } }