/* ============================================================
   ВСЕ ДИАЛОГИ — В ОДНОМ ОКНЕ (30.09.2026)
   Слева текст и нумерованный список, справа окно-лента обращений:
   новое приходит сверху с подсветкой, нижнее уходит. Под окном —
   системы, куда уходят данные (строкой, без иконок).
   ============================================================ */
.bi__box{
  display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1fr);
  gap:clamp(28px, 5vw, 96px); align-items:center;
}
.bi__points{ list-style:none; counter-reset:bi; margin:clamp(20px, 2vw, 30px) 0 0; padding:0; display:grid; gap:0; max-width:48ch; }
.bi__points li{
  counter-increment:bi; position:relative; padding:14px 0 14px 44px; border-top:1px solid var(--line);
  font-size:clamp(15px, 1.05vw, 17px); line-height:1.45; color:var(--fg);
}
.bi__points li:last-child{ border-bottom:1px solid var(--line); }
.bi__points li::before{
  content:counter(bi, decimal-leading-zero); position:absolute; left:0; top:15px;
  font:500 12.5px/1 var(--font-mono); color:var(--accent-1); letter-spacing:.06em;
}

.bi__stage{ position:relative; }
.bi__glass{
  position:absolute; right:-6%; top:-22%; width:62%; z-index:-1;
  mix-blend-mode:multiply; pointer-events:none;
  animation:bi-float 8s ease-in-out infinite;
}
@keyframes bi-float{ 0%,100%{ translate:0 0; } 50%{ translate:0 -10px; } }
.bi__win{
  position:relative;
  background:#fff; border:1px solid var(--line); border-radius:14px;
  box-shadow:0 1px 2px rgba(13,15,32,.05), 0 30px 60px -30px rgba(13,30,40,.35);
  overflow:hidden;
}
.bi__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 18px; border-bottom:1px solid var(--line); }
.bi__head b{ font:700 16px/1 var(--font); color:var(--fg); }
.bi__tabs{ display:flex; gap:4px; }
.bi__tabs i{ font:500 12px/1 var(--font); font-style:normal; padding:6px 9px; border-radius:4px; color:var(--fg-mute); }
.bi__tabs i.is-on{ background:var(--fg); color:#fff; }
.bi__list{ list-style:none; margin:0; padding:0; height:clamp(300px, 26vw, 360px); overflow:hidden; }
.bi__row{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px;
  padding:13px 18px; border-bottom:1px solid var(--line-soft);
}
.bi__row.is-new{ animation:bi-new 1.6s cubic-bezier(.2,.8,.2,1); }
@keyframes bi-new{
  0%{ opacity:0; transform:translateY(-12px); background:var(--accent-wash); }
  20%{ opacity:1; transform:none; }
  100%{ background:transparent; }
}
.bi__ic{
  display:grid; place-items:center; width:36px; height:36px; border-radius:10px;
  color:#fff; font:800 13px/1 var(--font);
}
.bi__txt{ display:grid; gap:3px; min-width:0; }
.bi__txt b{ font:600 13.5px/1.2 var(--font); color:var(--fg); }
.bi__txt span{ font-size:13.5px; line-height:1.3; color:var(--fg-lead); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bi__st{ font-style:normal; font:600 11.5px/1 var(--font); padding:6px 8px; border-radius:3px; white-space:nowrap; }
.bi__st--bot{ background:#e7f5ee; color:#17744a; }
.bi__st--man{ background:#fdf1dc; color:#8a5a00; }
.bi__sys{ display:flex; flex-wrap:wrap; gap:6px 18px; margin-top:16px; padding-left:4px; font:500 13px/1 var(--font-mono); color:var(--fg-mute); letter-spacing:.04em; }
.bi__sys::before{ content:"данные уходят в →"; color:var(--fg-lead); }
.bi__sys span{ color:var(--fg); }

@media (max-width: 900px){
  .bi__box{ grid-template-columns:1fr; }
  .bi__glass{ top:-14%; width:55%; }
  .bi__tabs{ display:none; }
}
@media (prefers-reduced-motion: reduce){ .bi__glass{ animation:none; } .bi__row.is-new{ animation:none; } }
.bi__glass--own{ width:48%; top:-30%; right:-4%; }
