/* Чат поддержки: кнопка с котом и окно переписки. Общий для лендинга
   и кабинета, поэтому цвета свои, а не из app.css. Выше всего на странице. */
.knw-fab,.knw-pop{
  --knw-lime:#A8FB05;--knw-lime-soft:#F1FFD6;--knw-ink:#0B0B0E;--knw-gray:#5E6166;--knw-gray-2:#6A6E74;
  --knw-line:#E7E8E6;--knw-plate:#F3F5F4;--knw-page:#FBFBFB;--knw-red:#D33A40;
  font-family:"Exo 2","Segoe UI",Arial,sans-serif;font-weight:500;box-sizing:border-box;
}
.knw-fab *,.knw-pop *{box-sizing:border-box}

.knw-fab{
  position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:65;
  width:62px;height:62px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:#fff;box-shadow:0 0 0 3px var(--knw-lime),0 10px 26px rgba(11,11,14,.22);
  display:grid;place-items:center;transition:transform .15s ease;
}
.knw-fab:hover{transform:translateY(-2px)}
.knw-fab:focus-visible{outline:3px solid var(--knw-ink);outline-offset:3px}
.knw-fab img{width:50px;height:auto;image-rendering:pixelated;margin-top:4px;pointer-events:none}
.knw-fab.on{box-shadow:0 0 0 3px var(--knw-ink),0 10px 26px rgba(11,11,14,.22)}
.knw-fab[hidden]{display:none}
.knw-badge{
  position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;padding:0 6px;border-radius:11px;
  background:var(--knw-red);color:#fff;font-size:12px;font-weight:800;line-height:22px;text-align:center;
  box-shadow:0 0 0 2px #fff;
}
.knw-badge[hidden]{display:none}

/* Сайт: ниже меню и окон страницы, выше обычного содержимого.
   Кабинет: ниже шторок и уведомлений (у них 100 и 120) */
.cab .knw-fab{z-index:90}
.cab .knw-pop{z-index:95}
@media (max-width:599px){
  .knw-fab{width:54px;height:54px}
  .knw-fab img{width:44px}
}
.knw-pop :is(a,button,input,textarea):focus-visible,.knw-fab:focus-visible{outline:3px solid #7ED100;outline-offset:2px}
@media (prefers-reduced-motion: reduce){
  .knw-fab,.knw-pop{transition:none;animation:none}
}

/* кабинет: над нижним меню, на ПК — в углу; на экранах с полем ввода — выше него.
   На телефоне кнопка поменьше, а под неё у экрана оставлен запас снизу (cabinet.css) */
.cab .knw-fab{bottom:calc(86px + env(safe-area-inset-bottom))}
@media (max-width:899px){
  .cab .knw-fab{width:54px;height:54px;right:12px}
  .cab .knw-fab img{width:44px}
}
/* кабинет на телефоне: чат открывается из шапки, плавающая кнопка не нужна */
@media (max-width:599px){
  .cab .knw-fab{display:none}
}
/* открыта шторка, окно или клавиатура — кнопка уходит, чтобы не закрывать поля и кнопки */
.knw-away .knw-fab{display:none}
.knw-up .cab .knw-fab,.knw-up .knw-fab{bottom:calc(150px + env(safe-area-inset-bottom))}
@media (min-width:900px){
  .cab .knw-fab{right:24px;bottom:24px}
  .knw-up .cab .knw-fab,.knw-up .knw-fab{bottom:104px}
}

.knw-pop{
  position:fixed;right:16px;bottom:calc(90px + env(safe-area-inset-bottom));z-index:66;
  width:380px;height:min(600px,calc(100vh - 120px));height:min(600px,calc(100dvh - 120px));
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--knw-page);color:var(--knw-ink);border:1px solid var(--knw-line);border-radius:24px;
  box-shadow:0 24px 60px rgba(11,11,14,.25);animation:knw-in .18s ease-out;
}
.knw-pop[hidden]{display:none}
.cab .knw-pop{bottom:calc(160px + env(safe-area-inset-bottom))}
@media (min-width:900px){
  .cab .knw-pop{right:24px;bottom:98px}
}
@keyframes knw-in{from{transform:translateY(16px);opacity:.4}}

/* телефон: окно на весь экран, кнопка под ним не нужна */
@media (max-width:599px){
  .knw-pop,.cab .knw-pop{inset:0;width:auto;height:auto;border:0;border-radius:0;padding-top:env(safe-area-inset-top)}
  .knw-open .knw-fab{display:none}
  .knw-open body{overflow:hidden}
}

.knw-head{flex:none;display:flex;align-items:center;gap:10px;padding:12px 12px 12px 14px;background:#fff;border-bottom:1px solid var(--knw-line)}
.knw-head .knw-av{width:40px}
.knw-title{flex:1;min-width:0;display:flex;flex-direction:column}
.knw-title b{font-size:16px;font-weight:800}
.knw-title span{font-size:13px;color:var(--knw-gray)}
.knw-x{width:44px;height:44px;border:1px solid var(--knw-line);border-radius:12px;background:#fff;display:grid;place-items:center;cursor:pointer;color:var(--knw-ink)}
.knw-body{flex:1;min-height:0;display:flex}

.knw-i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* переписка — и во всплывающем окне, и на экране кабинета */
.knw-chat{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;font-size:14.5px;line-height:1.4;color:var(--knw-ink,#0B0B0E)}
.knw-list{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:6px;padding:14px 12px}
.knw-m{display:flex;flex-direction:column;max-width:86%}
.knw-m.me{align-self:flex-end;align-items:flex-end}
.knw-m.them{align-self:flex-start;align-items:flex-start}
.knw-hello{flex-direction:row;align-items:flex-end;gap:6px;max-width:92%}
.knw-av{width:44px;height:auto;flex:none;image-rendering:pixelated}
.knw-b{padding:9px 12px;border-radius:18px;white-space:pre-wrap;word-break:break-word;background:#fff;border:1px solid var(--knw-line,#E7E8E6);border-bottom-left-radius:6px}
.knw-m.me .knw-b{background:var(--knw-lime,#A8FB05);border-color:transparent;border-radius:18px;border-bottom-right-radius:6px}
.knw-b.knw-hint{background:var(--knw-lime-soft,#F1FFD6);border-color:transparent}
.knw-img{display:block;margin:-3px -6px 6px;max-width:260px}
.knw-img img{display:block;max-width:100%;max-height:260px;border-radius:12px;object-fit:cover}
.knw-b .knw-img:last-child{margin-bottom:-3px}
.knw-meta{font-size:12px;color:var(--knw-gray-2,#8B8E93);margin:2px 6px 6px}
.knw-meta.bad{color:var(--knw-red,#E5484D);font-weight:600}
.knw-topics{display:flex;flex-wrap:wrap;gap:6px;padding:2px 0 4px 50px}
.knw-chip{
  min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--knw-line,#E7E8E6);background:#fff;cursor:pointer;
  font:600 14px "Exo 2","Segoe UI",Arial,sans-serif;color:var(--knw-ink,#0B0B0E);
}
.knw-chip:hover{background:var(--knw-lime-soft,#F1FFD6);border-color:#D9F7A3}
.knw-small{font-size:13px;color:var(--knw-gray,#5E6166);margin:4px 0}

/* быстрая тема: короткий ответ, ссылка в нужный раздел и отдельная кнопка отправки */
.knw-answer{max-width:92%;gap:8px}
.knw-go{display:inline-block;margin-top:8px;font-weight:700;color:var(--knw-ink,#0B0B0E);text-decoration:underline;text-decoration-color:var(--knw-lime,#A8FB05);text-decoration-thickness:3px;text-underline-offset:4px}
.knw-go::after{content:" →"}
.knw-topic-acts{flex-wrap:wrap;gap:10px 14px}
.knw-topic-acts .knw-btn{height:auto;min-height:40px;padding:8px 14px;white-space:normal;text-align:left}
.knw-center{text-align:center}
.knw-small a{color:inherit}

.knw-card{background:#fff;border:1px solid var(--knw-line,#E7E8E6);border-radius:18px;padding:12px;margin-top:6px;display:grid;gap:8px}
.knw-card b{font-size:14px}
.knw-card p{margin:0;font-size:13px;color:var(--knw-gray,#5E6166)}
.knw-row{display:flex;gap:8px;align-items:center}
.knw-row-links{justify-content:space-between}
.knw-inp{flex:1;min-width:0;height:44px;padding:0 12px;border:1px solid var(--knw-line,#E7E8E6);border-radius:12px;background:var(--knw-plate,#F3F5F4);font:500 14px "Exo 2","Segoe UI",Arial,sans-serif;color:var(--knw-ink,#0B0B0E)}
.knw-btn{height:44px;padding:0 14px;border:0;border-radius:12px;background:var(--knw-ink,#0B0B0E);color:var(--knw-lime,#A8FB05);font:700 13.5px "Exo 2","Segoe UI",Arial,sans-serif;cursor:pointer}
.knw-btn:disabled{opacity:.6}
.knw-link{border:0;background:none;padding:0;min-height:44px;font:600 13.5px "Exo 2","Segoe UI",Arial,sans-serif;color:var(--knw-gray,#5E6166);text-decoration:underline;cursor:pointer}

.knw-att{flex:none;display:flex;align-items:center;gap:10px;margin:0 12px 6px;padding:6px;background:#fff;border:1px solid var(--knw-line,#E7E8E6);border-radius:14px;font-size:13px}
.knw-att[hidden]{display:none}
.knw-att img{width:44px;height:44px;object-fit:cover;border-radius:10px}
.knw-att span{flex:1}
.knw-att-x{width:30px;height:30px;border:0;border-radius:10px;background:var(--knw-plate,#F3F5F4);display:grid;place-items:center;cursor:pointer;color:inherit}
.knw-att-x .knw-i{width:16px;height:16px}
.knw-err{flex:none;margin:0 14px 6px;font-size:13px;font-weight:600;color:var(--knw-red,#E5484D)}
.knw-err[hidden]{display:none}

.knw-dock{
  flex:none;display:flex;align-items:flex-end;gap:6px;margin:0 10px calc(10px + env(safe-area-inset-bottom));padding:6px;
  background:#fff;border:1px solid var(--knw-line,#E7E8E6);border-radius:22px;
}
.knw-ta{
  flex:1;min-width:0;min-height:40px;max-height:140px;resize:none;border:0;outline:none;background:none;
  padding:10px 4px;font:500 14.5px "Exo 2","Segoe UI",Arial,sans-serif;color:var(--knw-ink,#0B0B0E);
}
.knw-ib{width:44px;height:44px;flex:none;border:0;border-radius:14px;background:var(--knw-plate,#F3F5F4);display:grid;place-items:center;cursor:pointer;color:var(--knw-ink,#0B0B0E)}
.knw-ib.on{background:var(--knw-lime,#A8FB05)}
.knw-send{width:44px;height:44px;flex:none;border:0;border-radius:14px;background:var(--knw-ink,#0B0B0E);color:var(--knw-lime,#A8FB05);display:grid;place-items:center;cursor:pointer}
.knw-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.knw-dock [hidden]{display:none}

/* экран «Поддержка» в кабинете */
.sup-screen{flex:1;min-height:0;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line,#E7E8E6);border-radius:26px;overflow:hidden}
.sup-screen .knw-dock{background:var(--plate,#F3F5F4);border:0}
.sup-screen .knw-ib{background:#fff}

/* непрочитанные у пункта «Поддержка» в профиле */
.sup-unread{min-width:22px;height:22px;padding:0 7px;border-radius:11px;background:#E5484D;color:#fff;font-size:12px;font-weight:800;line-height:22px;text-align:center}
.sup-unread:empty{display:none}

/* тёмная тема Telegram */
.tg-dark .knw-pop,.tg-dark .knw-head,.tg-dark .knw-dock,.tg-dark .knw-b,.tg-dark .knw-chip,.tg-dark .knw-card,.tg-dark .knw-x,.tg-dark .sup-screen{
  background:var(--tg-section,#1f2126);color:#f2f3f5;border-color:#2f3138;
}
.tg-dark .knw-chat,.tg-dark .knw-ta{color:#f2f3f5}
.tg-dark .knw-m.me .knw-b{background:var(--knw-lime,#A8FB05);color:#0B0B0E}
.tg-dark .knw-go{color:#f2f3f5}