:root{
  /* TailAdmin dark ladder (contrast-safe):
     canvas #303238 → sidebar/topbar #36393f → cards #3b3e44 → border #555a62
     NEVER: --line == --panel / --input-bg == --line (text/borders vanish)
     Notes: _project_history/tailadmin_demo_notes.md */
  --bg:#303238;
  --panel:#3b3e44;
  --panel2:#475467;
  --text:#f9fafb;
  --muted:#98a2b3;
  --brand:#12b76a;
  --brand2:#32d583;
  --violet:#7a5af8;
  --violet2:#9b8afb;
  --danger:#f04438;
  --warn:#f79009;
  --line:#555a62;
  --shadow:0 1px 3px rgba(0,0,0,.28);
  --glow-emerald:none;
  --glow-violet:none;
  --radius:16px;
  --radius-sm:8px;
  --input-bg:#303238;
  --table-bg:#3b3e44;
  --card-bg:#3b3e44;
  --sidebar-bg:#36393f;
  --topbar-bg:#36393f;
  --topbar-mobile-bg:rgba(54,57,63,.96);
  --backdrop-scrim:rgba(35,37,41,.72);
  --chart-wrap-bg:#3b3e44;
  --filter-toggle-bg:#303238;
  --code-bg:#303238;
  --code-fg:#6ce9a6;
  --kpi-strong-bg:#3b3e44;
  --surface-inset:#303238;
  --surface-nested:#45494f;
  --surface-brand-soft:rgba(18,183,106,.12);
  --surface-violet-soft:rgba(122,90,248,.12);
  --surface-danger-soft:rgba(240,68,56,.12);
  --surface-success-soft:rgba(18,183,106,.12);
  --ring-brand:rgba(18,183,106,.45);
  --ring-violet:rgba(122,90,248,.4);
  --ring-danger:rgba(240,68,56,.4);
  --ring-success:rgba(18,183,106,.4);
  --st-active:#fdb022;
  --st-printing:#9b8afb;
  --st-delivery:#36bffa;
  --st-completed:#32d583;
  --st-returned:#f97066;
  --bg-soft:rgba(152,162,179,.08);
  --msg-in-bg:rgba(148,163,184,.16);
  /* TailAdmin chat: outgoing = brand (emerald), not VK blue */
  --msg-out-bg:#12b76a;
  --msg-out-text:#fff;
  --msg-out-link:#ecfdf3;
  --ok:var(--brand);
  --accent:#0ba5ec;
  --deal-new:#36bffa;
  --deal-new-bg:rgba(54,191,250,.16);
  --deal-new-border:rgba(54,191,250,.4);
  --deal-in-work:#32d583;
  --deal-in-work-bg:rgba(50,213,131,.16);
  --deal-in-work-border:rgba(50,213,131,.4);
  --deal-rejected:#f97066;
  --deal-rejected-bg:rgba(249,112,102,.14);
  --deal-rejected-border:rgba(249,112,102,.4);
  --deal-thinking:#fdb022;
  --deal-thinking-bg:rgba(253,176,34,.16);
  --deal-thinking-border:rgba(253,176,34,.4);
  --deal-completed:#9b8afb;
  --deal-completed-bg:rgba(155,138,251,.16);
  --deal-completed-border:rgba(155,138,251,.4);
  --font:"Outfit",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
html{
  color-scheme:dark;
  background:var(--bg);
}
html[data-theme="light"]{
  color-scheme:light;
  --bg:#f9fafb;
  --panel:#ffffff;
  --panel2:#d0d5dd;
  --text:#303238;
  --muted:#667085;
  --line:#e4e7ec;
  --shadow:0 1px 2px rgba(16,24,40,.04);
  --input-bg:#ffffff;
  --table-bg:#ffffff;
  --card-bg:#ffffff;
  --sidebar-bg:#ffffff;
  --topbar-bg:#ffffff;
  --topbar-mobile-bg:rgba(255,255,255,.97);
  --backdrop-scrim:rgba(16,24,40,.45);
  --chart-wrap-bg:#ffffff;
  --filter-toggle-bg:#f2f4f7;
  --code-bg:#ecfdf3;
  --code-fg:#027a48;
  --kpi-strong-bg:#ecfdf3;
  --surface-inset:#f2f4f7;
  --surface-nested:#f2f4f7;
  --surface-brand-soft:rgba(18,183,106,.1);
  --surface-violet-soft:rgba(122,90,248,.1);
  --surface-danger-soft:rgba(240,68,56,.08);
  --surface-success-soft:rgba(18,183,106,.1);
  --ring-brand:rgba(3,152,85,.4);
  --ring-violet:rgba(122,90,248,.35);
  --ring-danger:rgba(217,45,32,.35);
  --ring-success:rgba(3,152,85,.35);
  --violet:#7a5af8;
  --violet2:#6938ef;
  --glow-emerald:none;
  --glow-violet:none;
  --radius:16px;
  --brand:#12b76a;
  --brand2:#039855;
  --st-active:#dc6803;
  --st-printing:#6938ef;
  --st-delivery:#0086c9;
  --st-completed:#027a48;
  --st-returned:#b42318;
  --bg-soft:#f2f4f7;
  --ok:#027a48;
  --accent:#0086c9;
  --msg-in-bg:#f2f4f7;
  --msg-out-bg:#12b76a;
  --msg-out-text:#fff;
  --msg-out-link:#ecfdf3;
  --deal-new:#026aa2;
  --deal-new-bg:rgba(2,106,162,.1);
  --deal-new-border:rgba(2,106,162,.35);
  --deal-in-work:#027a48;
  --deal-in-work-bg:rgba(2,122,72,.1);
  --deal-in-work-border:rgba(2,122,72,.35);
  --deal-rejected:#b42318;
  --deal-rejected-bg:rgba(180,35,24,.08);
  --deal-rejected-border:rgba(180,35,24,.3);
  --deal-thinking:#dc6803;
  --deal-thinking-bg:rgba(220,104,3,.1);
  --deal-thinking-border:rgba(220,104,3,.35);
  --deal-completed:#6938ef;
  --deal-completed-bg:rgba(105,56,239,.1);
  --deal-completed-border:rgba(105,56,239,.35);
  background:var(--bg);
}
html[data-theme="light"] .msg-bubble--in{color:#303238;box-shadow:none}
html[data-theme="light"] .msg-bubble--out{color:var(--msg-out-text,#fff);box-shadow:none}
html[data-theme="light"] .msg-thread{
  background:#fff;
}
html[data-theme="light"] .msg-chat-head{background:#fff}
html[data-theme="light"] .msg-composer{background:transparent}
html[data-theme="light"] .msg-composer textarea{background:transparent}
html[data-theme="light"] .msg-conv-channel-badge{
  background:transparent;
  box-shadow:none;
}
html[data-theme="light"] .msg-emoji-panel{background:#fff}
html[data-theme="light"] .msg-bubble-sender{color:#757575}
html[data-theme="light"] .msg-row--out .msg-bubble-sender{color:rgba(255,255,255,.92)}
html[data-theme="light"] .msg-bubble--in .msg-bubble-text .msg-link{color:#0284c7}
html[data-theme="light"] .msg-bubble--out .msg-bubble-text .msg-link{color:var(--msg-out-link,#dbeafe)}
html[data-theme="light"] .msg-bubble-meta{color:#757575;opacity:.9}
html[data-theme="light"] .msg-bubble-checks--read::before,
html[data-theme="light"] .msg-bubble-checks--read::after{color:#3b82f6}
html[data-theme="light"] body{
  background:var(--bg);
  color:var(--text);
}
html[data-theme="light"] input[type="date"],
html[data-theme="light"] input[type="datetime-local"],
html[data-theme="light"] input[type="time"]{
  color-scheme:light;
}
html[data-theme="light"] input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="light"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
html[data-theme="light"] input[type="time"]::-webkit-calendar-picker-indicator{
  filter:none;
  opacity:.85;
}
html[data-theme="light"] .btn.danger{
  color:#b91c1c;
}
html[data-theme="light"] .btn.danger:hover{
  color:#991b1b;
}
/* Переключатель темы: виден на мобильных и десктопе */
.topbar-right{display:flex;flex-wrap:wrap;align-items:center;gap:10px;min-width:0;max-width:100%;justify-content:flex-end}
.topbar-user{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:0;
  max-width:min(220px,42vw);
  padding:4px 10px 4px 4px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--card-bg);
  color:var(--text);
  text-decoration:none;
  font-weight:600;
  font-size:13px;
  line-height:1.2;
  transition:border-color .12s ease,background .12s ease;
}
.topbar-user:hover{
  border-color:var(--brand);
  background:var(--surface-brand-soft);
  opacity:1;
}
.topbar-user.is-active{
  border-color:var(--brand);
  background:var(--surface-brand-soft);
}
.topbar-user .nav-avatar{
  width:32px;
  height:32px;
}
.topbar-user__name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.topbar-logout{
  flex-shrink:0;
  padding:8px 12px;
  font-size:13px;
  font-weight:600;
}
.topbar-login{
  flex-shrink:0;
  padding:8px 14px;
  font-size:13px;
  font-weight:700;
}
.theme-switch{flex-shrink:0;display:inline-flex;align-items:center}
.theme-switch__btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:40px;
  min-height:40px;
  padding:6px 8px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--card-bg);
  color:var(--text);
  cursor:pointer;
  font-size:16px;
  line-height:1;
  transition:background .15s, border-color .15s, box-shadow .15s;
}
.theme-switch__btn:hover{
  background:var(--bg-soft);
  border-color:var(--line);
  box-shadow:0 1px 2px rgba(16,24,40,.06);
}
.theme-switch__face{display:inline-block;opacity:.4;transition:opacity .15s, transform .12s;user-select:none}
html[data-theme="dark"] .theme-switch__face--moon{opacity:1;transform:scale(1.05)}
html[data-theme="dark"] .theme-switch__face--sun{opacity:.32}
html[data-theme="light"] .theme-switch__face--sun{opacity:1;transform:scale(1.05)}
html[data-theme="light"] .theme-switch__face--moon{opacity:.32}
html[data-theme="light"] .editor-rankings-grid .rank-chip--gold .rank-chip__num{color:#b45309;text-shadow:none}
html[data-theme="light"] .editor-rankings-grid .rank-chip--silver .rank-chip__num{color:#475569}
html[data-theme="light"] .editor-rankings-grid .rank-chip--bronze .rank-chip__num{color:#c2410c}
html[data-theme="light"] .editor-rankings-grid .rank-chip--rest .rank-chip__num{color:var(--violet2);background:var(--surface-violet-soft);border-color:color-mix(in srgb,var(--violet) 35%,var(--line));text-shadow:none;box-shadow:none}
html[data-theme="light"] .editor-monthly-winner-panel__name{color:#b45309}
html[data-theme="light"] .preview-banner-icon{color:var(--violet)}
.theme-switch--fab{
  position:fixed;
  z-index:60;
  right:max(14px, env(safe-area-inset-right, 0px));
  top:max(14px, env(safe-area-inset-top, 0px));
}
.theme-switch--fab .theme-switch__btn{
  min-width:51px;
  min-height:51px;
  padding:7px 9px;
  font-size:18px;
  border-radius:14px;
  box-shadow:var(--shadow);
}
.body--guest-login .theme-switch--fab{
  right:max(16px, calc(50% - 220px + 12px));
}
*{box-sizing:border-box}
html,body{height:100%}
/* Выделение и копирование текста разрешены (удобно для работы). Защита от копирования сайта целиком — через .htaccess: блокировка скраперов, X-Frame-Options. */
body{
  margin:0;
  font:14px/1.5 var(--font,"Outfit",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif);
  background:var(--bg);
  background-color:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
a:hover{opacity:.92}
.app{
  /* TailAdmin sidebar w-72.5 ≈ 290px */
  --sidebar-w:290px;
  display:grid;
  grid-template-columns:var(--sidebar-w) 1fr;
  min-height:100vh;
  max-width:none;
  width:100%;
  margin-inline:0;
  transition:grid-template-columns .2s ease;
  background:transparent;
}
.sidebar{
  position:sticky;top:0;height:100vh;padding:20px 20px 16px;border-right:1px solid var(--line);
  background:var(--sidebar-bg);
  width:var(--sidebar-w);max-width:var(--sidebar-w);box-sizing:border-box;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:0;
  transition:width .2s ease,padding .2s ease;
  z-index:40;
}
.sidebar-rail-mark{
  display:none;
  width:28px;height:28px;
  align-items:center;justify-content:center;
  border-radius:7px;
  border:0;
  background:transparent;
  overflow:hidden;
  flex-shrink:0;
  line-height:0;
  color:var(--text);
}
.sidebar-rail-mark svg{
  display:block;width:28px;height:28px;
}
.sidebar-rail-mark__fallback{
  display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;
  font-weight:800;font-size:18px;color:var(--text);
}
/* Кнопка rail-toggle удалена — на случай кэша/старого HTML */
#sidebar-rail-toggle,
.sidebar-rail-toggle{
  display:none !important;
  width:0 !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
  position:absolute !important;
  opacity:0 !important;
}
@media (min-width:1025px){
  .app:not(.app--guest-login){
    position:relative;
  }
  .sidebar-header{
    align-items:center;
    gap:4px;
    position:relative;
    justify-content:flex-start;
  }
  .sidebar-header .brand{
    flex:0 1 auto;
    min-width:0;
  }
  .sidebar .nav{margin-top:8px}
  /* ПК по умолчанию — миниатюра 80px; разворот только по hover (класс снят + flyout) */
  .app--sidebar-collapsed,
  html.html-sidebar-collapsed .app:not(.app--guest-login){
    --sidebar-w:80px;
  }
  .app--sidebar-collapsed .sidebar,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .sidebar{
    padding:12px 0 16px;
    overflow:hidden;
  }
  .app--sidebar-collapsed .sidebar .nav,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .sidebar .nav{
    padding:0;
    align-items:center;
    width:100%;
  }
  .app--sidebar-collapsed .sidebar [data-scrollbar="cropped"],
  html.html-sidebar-collapsed .app:not(.app--guest-login) .sidebar [data-scrollbar="cropped"]{
    overflow-x:hidden !important;
    width:100%;
  }
  .app--sidebar-collapsed .sidebar-header,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .sidebar-header{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0;
    width:100%;
    min-height:32px;
    margin:0 0 8px;
    position:relative;
  }
  .app--sidebar-collapsed .sidebar-header .brand,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .sidebar-header .brand{
    display:none;
  }
  .app--sidebar-collapsed .sidebar > .footer,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .sidebar > .footer{
    display:none;
  }
  .app--sidebar-collapsed .sidebar-rail-mark,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .sidebar-rail-mark{
    display:inline-flex;
    position:relative;
    z-index:1;
  }
  .app--sidebar-collapsed .nav,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav{
    margin-top:0;align-items:center;gap:4px;
  }
  .app--sidebar-collapsed .nav a,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav a{
    width:44px;min-height:42px;padding:8px 0;margin:0 auto;
    justify-content:center;position:relative;
    font-size:0;line-height:0;gap:0;
    box-sizing:border-box;
    max-width:100%;
  }
  .app--sidebar-collapsed .nav a > span:not(.nav-msg-badge),
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav a > span:not(.nav-msg-badge){
    font-size:17px;line-height:1;
    display:inline-flex;
    width:32px;height:32px;flex:0 0 32px;
    align-items:center;justify-content:center;
    border-radius:8px;
  }
  .app--sidebar-collapsed .nav a > span.nav-avatar,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav a > span.nav-avatar{
    display:inline-flex;width:28px;height:28px;font-size:inherit;line-height:1;
  }
  .app--sidebar-collapsed .nav a > span.nav-avatar .nav-avatar-fallback,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav a > span.nav-avatar .nav-avatar-fallback{
    font-size:11px;
  }
  .app--sidebar-collapsed .nav-msg-badge,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav-msg-badge{
    position:absolute;top:2px;right:2px;margin:0;z-index:1;
    min-width:16px;height:16px;padding:0 4px;font-size:10px;
  }
  .app--sidebar-collapsed .nav-group > summary,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav-group > summary{
    display:none;
  }
  .app--sidebar-collapsed .nav-group,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav-group{
    width:100%;max-width:100%;min-width:0;align-items:center;box-sizing:border-box;
  }
  .app--sidebar-collapsed .nav-group-items,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .nav-group-items{
    display:flex !important;flex-direction:column;align-items:center;
    gap:4px;margin:0;padding:0;width:100%;max-width:100%;min-width:0;box-sizing:border-box;
    border-left:0;
  }
  .app--sidebar-collapsed .msg-inbox,
  html.html-sidebar-collapsed .app:not(.app--guest-login) .msg-inbox{
    grid-template-columns:minmax(360px,520px) minmax(0,1fr);
  }
  /*
   * Hover: колонка сетки всегда 80px (main не сжимается).
   * Сайдбар остаётся в потоке (НЕ absolute — иначе grid отдаёт main в первую колонку)
   * и визуально перехлёстывает контент за счёт width + z-index.
   * Специфичность: html.html-sidebar-collapsed … — выше свёрнутых правил.
   */
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login),
  .app.app--sidebar-hover-expand:not(.app--guest-login){
    --sidebar-w:80px;
    overflow:visible;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) > main,
  .app.app--sidebar-hover-expand:not(.app--guest-login) > main{
    position:relative;
    z-index:1;
    min-width:0;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar{
    position:sticky;
    left:0;
    top:0;
    z-index:80;
    width:var(--sidebar-expanded-w, max-content);
    max-width:min(420px, 92vw);
    min-width:200px;
    height:100vh;
    padding:16px 10px 16px 8px;
    overflow-x:hidden;
    overflow-y:auto;
    box-shadow:8px 0 28px rgba(16,24,40,.28);
    border-right:1px solid var(--line);
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar-header,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar-header{
    justify-content:flex-start;
    margin:0;
    min-height:auto;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar-header .brand,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar-header .brand{
    display:flex;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar-rail-mark,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar-rail-mark{
    display:none;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar > .footer,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .sidebar > .footer{
    display:block;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .nav,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .nav{
    margin-top:8px;
    align-items:stretch;
    gap:4px;
    width:100%;
    max-width:100%;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .nav a,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .nav a{
    width:100%;
    max-width:100%;
    min-height:0;
    margin:0;
    padding:9px 10px 9px 8px;
    justify-content:flex-start;
    font-size:14px;
    line-height:1.25;
    gap:10px;
    white-space:nowrap;
    box-sizing:border-box;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .nav a > span:not(.nav-msg-badge),
  .app.app--sidebar-hover-expand:not(.app--guest-login) .nav a > span:not(.nav-msg-badge){
    font-size:17px;
    line-height:1;
    width:36px;height:36px;flex:0 0 36px;
    display:inline-flex;
    align-items:center;justify-content:center;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .nav-msg-badge,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .nav-msg-badge{
    position:static;
    margin-left:auto;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .nav-group > summary,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .nav-group > summary{
    display:flex;
    white-space:nowrap;
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .nav-group-items,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .nav-group-items{
    align-items:stretch;
    margin:0 0 4px 18px;
    padding:0 0 0 10px;
    border-left:1px solid var(--line);
  }
  html.html-sidebar-collapsed .app.app--sidebar-hover-expand:not(.app--guest-login) .msg-inbox,
  .app.app--sidebar-hover-expand:not(.app--guest-login) .msg-inbox{
    grid-template-columns:minmax(360px,520px) minmax(0,1fr);
  }
}
.brand{display:flex;gap:10px;align-items:center;padding:4px 2px;border:0;border-radius:0;box-shadow:none;background:transparent}
.brand .dot{width:10px;height:10px;border-radius:99px;background:var(--brand)}
.brand .title{font-weight:700;letter-spacing:.2px}
.brand .sub{color:var(--muted);font-size:12px}
.brand--logo{
  flex-direction:column;align-items:flex-start;gap:0;padding:4px 2px;
}
.brand-logo{
  display:block;line-height:0;color:var(--text);max-width:100%;
}
.brand-logo svg{
  display:block;width:100%;max-width:152px;height:auto;
  aspect-ratio:257 / 64;
}
/* ПК: компактнее полное лого; значок при сворачивании не трогаем */
@media (min-width:1025px){
  .brand-logo svg{max-width:136px}
}
.nav{margin-top:16px;display:flex;flex-direction:column;gap:2px}
/* TailAdmin menu-item: иконка слева, soft active, badge справа */
.nav a{
  padding:10px 12px;border-radius:8px;border:1px solid transparent;color:var(--muted);
  display:flex;align-items:center;justify-content:flex-start;gap:12px;
  font-size:14px;font-weight:500;line-height:1.25;
  transition:background .12s ease,color .12s ease;
}
.nav a:hover{background:var(--bg-soft);border-color:transparent;color:var(--text);opacity:1}
.nav a.active{
  background:var(--surface-brand-soft);
  border-color:transparent;
  box-shadow:none;
  color:var(--brand);
  font-weight:600;
}
.nav a.active:hover{background:var(--surface-brand-soft);color:var(--brand)}
.nav a > span:not(.nav-msg-badge){
  order:-1;
  flex:0 0 36px;
  width:36px;height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  font-size:17px;
  border-radius:8px;
  background:rgba(148,163,184,.08);
  transition:background .12s ease,color .12s ease;
}
.nav a:hover > span:not(.nav-msg-badge){
  background:rgba(148,163,184,.14);
}
.nav a.active > span:not(.nav-msg-badge){
  background:color-mix(in srgb, var(--brand) 18%, transparent);
  color:var(--brand);
}
.nav a .nav-msg-badge{margin-left:auto;order:2}
.nav-avatar{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:99px;overflow:hidden;flex-shrink:0;
  background:var(--surface-inset, rgba(148,163,184,.12));
  border:1px solid var(--line);
}
.nav-avatar-img{width:100%;height:100%;object-fit:cover;display:block}
.nav-avatar-fallback{font-size:11px;font-weight:800;line-height:1;color:var(--muted)}
/* Группы меню (сворачиваемые секции) */
.nav-group{display:flex;flex-direction:column;gap:2px}
.nav-group>summary{
  list-style:none;cursor:pointer;padding:10px 12px 6px;margin-top:10px;
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  border-radius:8px;border:1px solid transparent;user-select:none;transition:color .15s;
}
.nav-group>summary::-webkit-details-marker{display:none}
.nav-group>summary::marker{content:""}
.nav-group>summary:hover{color:var(--text);background:transparent}
.nav-group>summary .nav-group-chev{font-size:10px;opacity:.55;transition:transform .15s}
.nav-group[open]>summary .nav-group-chev{transform:rotate(180deg)}
.nav-group-items{
  display:flex;flex-direction:column;gap:2px;
  margin:0 0 4px 18px;padding:0 0 0 10px;
  border-left:1px solid var(--line);
}
.nav-group-items a{font-size:13.5px;padding:9px 12px}
.nav-group-items a > span:not(.nav-msg-badge){
  width:32px;height:32px;flex-basis:32px;font-size:15px;
}
.main{
  padding:0;
  min-width:0;
  color:var(--text);
  background:transparent;
  display:flex;
  flex-direction:column;
  min-height:100vh;
}
.main-body{
  padding:24px 28px 32px;
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:24px;
}
.main-body--guest{
  padding:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  flex:1 1 auto;
  gap:0;
}
/* Единый ритм карточек на всех страницах (вместо разрозненных margin-top) */
.main-body > .card{
  margin-top:0 !important;
  margin-bottom:0 !important;
}
.main-body > .flash{
  margin:0;
}
.main h1,.main h2,.main h3,.main h4{
  color:var(--text);
  font-weight:600;
  line-height:1.25;
  letter-spacing:-.02em;
}
.main h1{font-size:clamp(1.35rem,2.5vw,1.75rem);margin:0 0 10px}
.main h2{font-size:clamp(1.1rem,2vw,1.25rem);margin:16px 0 8px}
.main h3{font-size:1.05rem;margin:12px 0 6px}
.main p{margin:0 0 10px}
.main ul,.main ol{margin:0 0 10px;padding-left:1.25em}
.main li{margin:4px 0}
.main code:not(pre code){
  background:var(--code-bg);
  color:var(--code-fg);
  padding:2px 6px;
  border-radius:6px;
  font-size:0.92em;
  word-break:break-word;
}
.main pre{
  background:var(--code-bg);
  color:var(--code-fg);
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px 14px;
  overflow:auto;
  font-size:13px;
  line-height:1.4;
}
.main strong{color:var(--text)}
/* Утилиты для вёрстки модулей (предпочтительно вместо inline rgba(2,6,23,…)) */
.crm-surface-inset{background:var(--surface-inset)}
.crm-surface-nested{background:var(--surface-nested)}
.crm-muted{color:var(--muted)}
.crm-text{color:var(--text)}
.crm-link{
  color:var(--brand);
  text-decoration:underline;
}
.crm-link:hover{opacity:1}
.crm-border{border:1px solid var(--line);border-radius:12px}
.crm-panel-soft{
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-inset);
}
.topbar{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:12px 16px;
  margin:0;
  padding:14px 28px;
  border-bottom:1px solid var(--line);
  background:var(--topbar-bg, var(--card-bg));
  position:sticky;
  top:0;
  z-index:30;
  min-height:64px;
  box-sizing:border-box;
}
.topbar-heading{display:flex;align-items:center;gap:12px;min-width:0;flex:1}
.topbar-titles{min-width:0;flex:1}
.topbar-title{font-size:clamp(1.25rem,1.8vw,1.5rem);font-weight:600;letter-spacing:-.02em;line-height:1.25;color:var(--text)}
.topbar-subtitle{margin-top:2px;color:var(--muted);font-size:14px;font-weight:400}
.crm-breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:4px;font-size:12px;line-height:1.4}
.crm-breadcrumbs .crm-crumb{color:var(--muted);text-decoration:none;border-radius:6px;padding:1px 4px}
.crm-breadcrumbs a.crm-crumb:hover{color:var(--text);background:rgba(148,163,184,.10)}
.crm-breadcrumbs .crm-crumb.is-current{color:var(--text);font-weight:600}
.crm-breadcrumbs .crm-crumb-sep{color:var(--muted);opacity:.6}
/* Вкладки раздела — как фильтры Contacts (segmented pills), не «браузерные табы» */
.crm-section-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:0 0 18px;
  padding:4px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-inset);
  width:fit-content;
  max-width:100%;
}
.crm-section-tab{
  display:inline-flex;
  align-items:center;
  padding:8px 14px;
  border-radius:9px;
  color:var(--muted);
  text-decoration:none;
  font-weight:600;
  font-size:13px;
  border:1px solid transparent;
  margin:0;
  transition:color .12s,background .12s,box-shadow .12s;
}
.crm-section-tab:hover{color:var(--text);background:rgba(148,163,184,.10);opacity:1}
.crm-section-tab.is-active{
  color:var(--text);
  background:var(--card-bg);
  border-color:transparent;
  box-shadow:none;
}
/* .btn задаёт display:inline-flex ниже — без !important кнопка «Меню» видна на десктопе */
.sidebar-toggle{display:none !important;align-items:center;gap:8px;flex-shrink:0;padding:10px 14px;font-weight:600}
.sidebar-toggle-icon{font-size:18px;line-height:1}
.sidebar-header{display:flex;align-items:center;gap:8px;justify-content:flex-start;flex-shrink:0}
.sidebar-header .brand{flex:0 1 auto;min-width:0}
@media (max-width:1024px){
  .sidebar-header{justify-content:space-between}
  .sidebar-header .brand{flex:1;min-width:0}
}
.sidebar-close{
  display:none !important;
  flex-shrink:0;
  min-width:40px;
  min-height:40px;
  padding:0 10px;
  font-size:22px;
  line-height:1;
  font-weight:400;
  border-radius:12px;
}
.sidebar-backdrop{display:none}
/* ПК: если пунктов меню больше, чем высота экрана — скролл только у списка ссылок; иначе полосы нет */
@media (min-width:1025px){
  .sidebar{
    display:flex;
    flex-direction:column;
    min-height:0;
    overflow:hidden;
  }
  /* flex-basis 0% — как у списка диалогов: иначе host растёт с контентом и thumb ≈ 100% */
  .sidebar .nav{
    flex:1 1 0%;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    padding-right:4px;
  }
  .sidebar > .footer{
    flex-shrink:0;
    margin-top:auto;
    padding-top:16px;
  }
}
/* Мобилка: тот же паттерн — скролл у .nav, шапка drawer не уезжает */
@media (max-width:1024px){
  .sidebar .nav{
    flex:1 1 0%;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .sidebar > .footer{
    flex-shrink:0;
    margin-top:auto;
    padding-top:12px;
  }
}
.card{
  background:var(--card-bg);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  color:var(--text);
}
.card .card-h{padding:20px 24px 0 24px}
.card .card-h h2,.card .card-h h3{margin:0 0 2px 0;font-size:16px;font-weight:600;letter-spacing:-.02em}
.card .card-b{padding:20px 24px}
/* Заголовок карточки с действием справа */
.card-h.card-h--row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}
/* Пустое состояние: единый стиль для «нет данных» */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:40px 20px;color:var(--muted)}
.empty-state .empty-state-icon{font-size:30px;line-height:1;opacity:.75}
.empty-state .empty-state-title{font-weight:600;color:var(--text)}
.empty-state .empty-state-text{font-size:14px;max-width:420px;line-height:1.5}
.grid{display:grid;gap:24px}
.grid.cols-4{grid-template-columns: repeat(4, minmax(0,1fr))}
.grid.cols-3{grid-template-columns: repeat(3, minmax(0,1fr))}
.grid.cols-2{grid-template-columns: repeat(2, minmax(0,1fr))}
/* Карточки KPI одинаковой высоты во всех строках сетки (не только внутри одной строки) */
.grid.cols-4:has(> .card.kpi),
.grid.cols-3:has(> .card.kpi),
.grid.cols-2:has(> .card.kpi){grid-auto-rows:1fr}
/* TailAdmin CRM metric: VALUE first (30px), label, hint */
.kpi{padding:24px;min-width:0;display:flex;flex-direction:column;height:100%;min-height:120px}
.kpi .value{order:1;font-size:clamp(1.5rem,2.4vw,1.875rem);font-weight:700;margin:0;line-height:1.2;letter-spacing:-.02em;color:var(--text);overflow-wrap:break-word;word-break:break-word}
.kpi .label{order:2;color:var(--muted);font-size:14px;font-weight:500;margin-top:8px}
.kpi .hint{order:3;color:var(--muted);font-size:12px;margin-top:auto;padding-top:10px;overflow-wrap:break-word;word-break:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.grid.cols-4>.card.kpi,.grid.cols-3>.card.kpi{min-width:0}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:40px;padding:10px 16px;border-radius:var(--radius-sm,8px);
  /* Secondary = card fill + visible border (never same as canvas / never text==fill) */
  border:1px solid var(--line);background:var(--card-bg);color:var(--text);
  cursor:pointer;font-weight:500;font-size:14px;line-height:1.25;
  transition:background .12s ease,border-color .12s ease,filter .12s ease,color .12s ease;
  text-decoration:none;
  box-shadow:none;
}
.btn:hover{background:var(--surface-nested);border-color:var(--panel2);color:var(--text);opacity:1}
.btn.primary{
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
  box-shadow:none;
}
.btn.primary:hover{
  filter:brightness(1.08);
  background:var(--brand2);
  border-color:var(--brand2);
  color:#fff;
}
.btn.btn-neon-violet,
.btn.btn-outline{
  background:var(--card-bg);
  border-color:var(--line);
  color:var(--text);
  box-shadow:none;
}
.btn.btn-neon-violet:hover,
.btn.btn-outline:hover{
  background:var(--surface-nested);
  border-color:var(--panel2);
  color:var(--text);
}
.btn.good{
  background:var(--surface-success-soft);
  border-color:color-mix(in srgb, var(--brand) 40%, var(--line));
  color:var(--st-completed);
}
.btn.danger{
  background:var(--surface-danger-soft);
  border-color:color-mix(in srgb, var(--danger) 40%, var(--line));
  color:var(--st-returned);
}
.btn.danger:hover{filter:brightness(1.08)}
.btn.small{min-height:32px;padding:6px 10px;border-radius:9px;font-size:12px}
.btn-group{display:flex;gap:8px;flex-wrap:wrap}
.btn-group.order-form-actions{justify-content:space-between;align-items:center;margin-top:12px}
.btn-group .btn.active{background:var(--surface-brand-soft);border-color:transparent;color:var(--brand)}
.btn-group--form-footer{align-items:center}
html[data-theme="light"] .btn:not(.primary):not(.danger):not(.good),
html[data-theme="light"] .btn.btn-outline,
html[data-theme="light"] .btn.btn-neon-violet{
  background:#fff;
  border-color:#e4e7ec;
  color:#303238;
}
html[data-theme="light"] .btn:not(.primary):not(.danger):not(.good):hover,
html[data-theme="light"] .btn.btn-outline:hover,
html[data-theme="light"] .btn.btn-neon-violet:hover{
  background:#f2f4f7;
  border-color:#d0d5dd;
  color:#303238;
}
/* Primary NEVER inherits white fill from light .btn — white-on-white = invisible */
html[data-theme="light"] .btn.primary,
html[data-theme="light"] a.btn.primary{
  background:#12b76a !important;
  border-color:#12b76a !important;
  color:#fff !important;
}
html[data-theme="light"] .btn.primary:hover,
html[data-theme="light"] a.btn.primary:hover{
  background:#039855 !important;
  border-color:#039855 !important;
  color:#fff !important;
}
input,select,textarea{
  width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--line);
  background:var(--input-bg);color:var(--text);outline:none;font:inherit;
  transition:border-color .12s ease,box-shadow .12s ease;
}
input:focus,select:focus,textarea:focus{
  border-color:color-mix(in srgb, var(--brand) 55%, var(--line));
  box-shadow:0 0 0 3px var(--ring-brand);
}
/* Иконка календаря/тайм-пикера у нативных полей — светлая на тёмном фоне (Chromium, Safari, Edge) */
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator{
  cursor:pointer;
  filter:invert(1);
  opacity:1;
}
input[type="date"],
input[type="datetime-local"],
input[type="time"]{
  color-scheme:dark;
}
textarea{min-height:92px;resize:vertical}
label{display:block;color:var(--muted);font-size:12px;margin-bottom:6px}
.field{margin-bottom:10px}
.password-field{position:relative;display:block}
.password-field input{width:100%;padding-right:44px}
.password-field__toggle{
  position:absolute;
  right:4px;
  top:50%;
  transform:translateY(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:32px;
  padding:0;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--muted);
  cursor:pointer;
}
.password-field__toggle:hover{color:var(--text);background:rgba(148,163,184,.12)}
.password-field__toggle:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.password-field__icon{display:block;flex-shrink:0}
.password-field__icon[hidden]{display:none}
.filter-toggle-btn{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:39px;padding:8px 14px;border:1px solid var(--line);border-radius:12px;cursor:pointer;width:100%;max-width:100%;font-size:14px;background:var(--filter-toggle-bg);color:var(--text);transition:background .15s,border-color .15s}
.filter-toggle-btn:hover{border-color:var(--muted)}
.filter-toggle-btn:has(.filter-toggle-input:checked),.filter-toggle-btn.active{background:rgba(16,185,129,.18);border-color:rgba(16,185,129,.5)}
.filter-toggle-dot{width:8px;height:8px;border-radius:50%;background:var(--muted);flex-shrink:0}
.filter-toggle-btn:has(.filter-toggle-input:checked) .filter-toggle-dot,.filter-toggle-btn.active .filter-toggle-dot{background:var(--brand)}
/* Визуально скрытый чекбокс без растягивания на весь экран (иначе клики цепляют чужие поля) */
.filter-toggle-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;opacity:0}
.row{display:grid;gap:10px}.row.cols-2{grid-template-columns: 1fr 1fr}.row.cols-3{grid-template-columns:1fr 1fr 1fr}.row.cols-4{grid-template-columns:1fr 1fr 1fr 1fr}

/* Карточка заказа: ряды без дыр, ширины по смыслу поля */
.order-form-layout{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:10px;
}
.order-form-row{
  display:grid;
  gap:10px 12px;
  align-items:start;
  width:100%;
}
.order-form-row > .field{
  margin-bottom:0;
  min-width:0;
}
.order-form-row > .field > label{
  display:block;margin-bottom:4px;font-size:12px;color:var(--muted);font-weight:600;
}
.order-form-row > .field input,
.order-form-row > .field select{
  width:100%;max-width:100%;box-sizing:border-box;
}
/* Дата сделки: дата + часы:минуты в одну линию, без растягивания */
.order-form-row .order-deal-at-row{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:8px;
  width:100%;
}
.order-form-row .order-deal-at-row > .order-deal-at-date{
  flex:0 0 auto !important;
  width:10.5rem !important;
  min-width:10.5rem !important;
  max-width:10.5rem !important;
}
.order-form-row .order-deal-at-time-group{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:4px;
  flex:0 0 auto !important;
  width:auto !important;
}
.order-form-row .order-deal-at-time-group > .order-deal-at-hm{
  flex:0 0 auto !important;
  width:4.75rem !important;
  min-width:4.75rem !important;
  max-width:5.25rem !important;
  padding:8px 8px !important;
  text-align:center;
  box-sizing:border-box !important;
}
/* Клиент | Телефон | SKU | Источник | Статус (+ возврат при правке) */
.order-form-row--main{
  grid-template-columns:minmax(180px,2fr) minmax(140px,1.1fr) minmax(110px,.95fr) minmax(120px,1fr) minmax(130px,1.05fr);
}
.order-form-layout--editor .order-form-row--main{
  grid-template-columns:minmax(180px,2fr) minmax(140px,1.1fr) minmax(110px,.95fr) minmax(130px,1fr);
}
.order-form-row--main:has(> .field--refund){
  grid-template-columns:minmax(160px,1.8fr) minmax(130px,1fr) minmax(100px,.9fr) minmax(110px,1fr) minmax(120px,1fr) minmax(130px,1.05fr);
}
.order-form-row--main .field--sku input{
  font-variant-numeric:tabular-nums;
}
/* Дата сделки | Срок | Авто дата | Редактор */
.order-form-row--meta{
  grid-template-columns:minmax(260px,1.9fr) minmax(120px,1fr) minmax(150px,1.15fr) minmax(150px,1.2fr);
}
.order-form-layout--editor .order-form-row--meta{
  grid-template-columns:minmax(140px,1fr) minmax(180px,1.3fr);
}

/* ——— Форма «Новый заказ в очередь» редактора: ширины по контексту ——— */
.order-form--editor-queue{
  --eq-gap: 10px 12px;
}
.order-form--editor-queue .field-hint{
  margin-top:4px;
  color:var(--muted);
  max-width:18rem;
  line-height:1.35;
}
.order-form--editor-queue .order-form-layout--editor-queue{
  margin-bottom:12px;
}
/* 1) Клиент | телефон | SKU | источник | статус */
.order-form--editor-queue .order-form-row--identity{
  display:grid;
  grid-template-columns:minmax(14rem, 22rem) 13.5rem minmax(8rem, 11rem) auto auto;
  gap:var(--eq-gap);
  align-items:start;
  justify-content:start;
  width:100%;
}
.order-form--editor-queue .field--client{
  max-width:22rem;
  width:100%;
}
.order-form--editor-queue .field--phone{
  width:13.5rem;
  max-width:13.5rem;
}
.order-form--editor-queue .field--phone input{
  width:100%;
  font-variant-numeric:tabular-nums;
}
.order-form--editor-queue .field--sku{
  width:11rem;
  max-width:11rem;
}
.order-form--editor-queue .field--sku input{
  width:100%;
  font-variant-numeric:tabular-nums;
}
/* 2) Сроки */
.order-form--editor-queue .order-form-row--timing{
  display:grid;
  grid-template-columns:auto auto auto auto;
  gap:var(--eq-gap);
  align-items:end;
  justify-content:start;
  width:100%;
}
.order-form--editor-queue .order-form-row--timing .field--deal{
  width:auto;
}
/* 3) Ссылка шире комментария (URL длинный) */
.order-form--editor-queue .order-form-row--chat{
  display:grid;
  grid-template-columns:minmax(16rem, 28rem) minmax(14rem, 22rem);
  gap:var(--eq-gap);
  align-items:start;
  justify-content:start;
  width:100%;
}
.order-form--editor-queue .field--link,
.order-form--editor-queue .field--comment{
  width:100%;
  max-width:100%;
}
/* 4) Услуга: категория по контенту, позиция гибкая */
.order-form--editor-queue .order-service-pick-panel{
  margin-top:4px;
}
.order-form--editor-queue .order-service-pick{
  display:grid;
  grid-template-columns:auto minmax(16rem, 32rem);
  gap:var(--eq-gap);
  align-items:start;
  justify-content:start;
  width:100%;
}
.order-form--editor-queue .order-service-pick:has(> .order-service-pick__tier:not([hidden])){
  grid-template-columns:auto auto minmax(14rem, 28rem);
}
.order-form--editor-queue .order-service-pick__cat{
  width:fit-content;
  max-width:20rem;
}
.order-form--editor-queue .order-service-pick__cat select{
  width:auto;
  min-width:11rem;
  max-width:20rem;
  field-sizing:content;
}
.order-form--editor-queue .order-service-pick__item{
  max-width:32rem;
}
/* 5) Суммы: до ~6 цифр + оплата compact */
.order-form--editor-queue .order-amount-split-row--compact,
.order-form--editor-queue .order-amount-split-row.order-amount-split-row--compact{
  display:grid;
  grid-template-columns:9.25rem 9.25rem 9.25rem auto;
  gap:var(--eq-gap);
  align-items:end;
  justify-content:start;
  width:auto;
  max-width:100%;
  margin-top:10px;
  margin-bottom:10px;
}
.order-form--editor-queue .field--money{
  width:9.25rem;
  max-width:9.25rem;
  margin-bottom:0;
}
.order-form--editor-queue .field--money > label{
  display:block;
  margin-bottom:4px;
  font-size:12px;
  color:var(--muted);
  font-weight:600;
  line-height:1.25;
  white-space:normal;
}
.order-form--editor-queue .field--money input{
  width:100%;
  max-width:100%;
  text-align:right;
  font-variant-numeric:tabular-nums;
}
.order-form--editor-queue .field--prepaid.field--compact{
  align-self:end;
}
.order-form--editor-queue .field--compact{
  width:fit-content;
  max-width:100%;
  min-width:0;
}
.order-form--editor-queue .field--compact > label{white-space:nowrap}
.order-form--editor-queue .field--compact select,
.order-form--editor-queue .field--compact input[disabled]{
  width:auto;
  min-width:8.5rem;
  max-width:min(100%, 16rem);
  field-sizing:content;
}
.order-form--editor-queue .field--deadline-auto input[disabled]{
  min-width:7rem;
  max-width:9rem;
  text-align:center;
}
.order-form--editor-queue .field--editor input[disabled]{
  min-width:8rem;
  max-width:12rem;
}
/* 6) Адрес */
.order-form--editor-queue .order-form-row--address{
  display:grid;
  grid-template-columns:12rem minmax(16rem, 26rem);
  gap:var(--eq-gap);
  align-items:start;
  justify-content:start;
  width:100%;
}
.order-form--editor-queue .field--city{
  width:12rem;
  max-width:12rem;
}
.order-form--editor-queue .field--street{
  max-width:26rem;
  width:100%;
}
.order-form--editor-queue .order-form-actions--editor-queue{
  margin-top:14px;
  gap:10px;
  flex-wrap:wrap;
}
@media (max-width:1100px){
  .order-form--editor-queue .order-form-row--identity,
  .order-form--editor-queue .order-form-row--timing,
  .order-form--editor-queue .order-form-row--chat,
  .order-form--editor-queue .order-form-row--address,
  .order-form--editor-queue .order-amount-split-row--compact,
  .order-form--editor-queue .order-service-pick,
  .order-form--editor-queue .order-service-pick:has(> .order-service-pick__tier:not([hidden])){
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
  .order-form--editor-queue .field--client,
  .order-form--editor-queue .field--phone,
  .order-form--editor-queue .field--sku,
  .order-form--editor-queue .field--city,
  .order-form--editor-queue .field--street,
  .order-form--editor-queue .field--money,
  .order-form--editor-queue .field--link,
  .order-form--editor-queue .field--comment,
  .order-form--editor-queue .order-service-pick__cat,
  .order-form--editor-queue .order-service-pick__item{
    width:auto;
    max-width:none;
  }
  .order-form--editor-queue .field--compact select,
  .order-form--editor-queue .field--compact input[disabled],
  .order-form--editor-queue .order-service-pick__cat select{
    width:100%;
    max-width:100%;
    min-width:0;
  }
}
@media (max-width:640px){
  .order-form--editor-queue .order-form-row--identity,
  .order-form--editor-queue .order-form-row--timing,
  .order-form--editor-queue .order-form-row--chat,
  .order-form--editor-queue .order-form-row--address,
  .order-form--editor-queue .order-amount-split-row--compact,
  .order-form--editor-queue .order-service-pick,
  .order-form--editor-queue .order-service-pick:has(> .order-service-pick__tier:not([hidden])){
    grid-template-columns:1fr;
  }
}
/* Суммы при правке + оплата после срочности */
.order-form-row--contact{
  grid-template-columns:minmax(16rem, 28rem) minmax(16rem, 28rem);
  justify-content:start;
}
.order-form-row--address{
  grid-template-columns:minmax(12rem, 16rem) minmax(16rem, 28rem);
  justify-content:start;
  max-width:48rem;
}
.order-form-row--address .field--city{
  max-width:16rem;
}
.order-form-row--address .field--street{
  max-width:28rem;
}
/* Суммы ₽ — не растягивать на всю колонку карточки */
.order-amount-split-row .field input[name="amount_processing"],
.order-amount-split-row .field input[name="amount_print"],
.order-amount-split-row .field input[name="urgent_amount"],
.order-form-row--money .field--amount input{
  max-width:12rem;
}
.order-amount-split-row.cols-4{
  grid-template-columns:repeat(4, minmax(0, 12.5rem));
  justify-content:start;
}
.order-amount-split-row .field--prepaid{margin-bottom:0}
.order-form-row--money{
  grid-template-columns:repeat(3, minmax(0, 12.5rem));
  justify-content:start;
}
.order-form-row--money:not(:has(> .field--prepaid)){
  grid-template-columns:repeat(2, minmax(0, 12.5rem));
  justify-content:start;
}
/* Автоподбор города / улицы */
.crm-ac-wrap{position:relative}
.crm-ac-list{
  position:absolute;z-index:40;left:0;right:0;top:calc(100% + 4px);
  max-height:240px;overflow:auto;
  background:var(--card, #1c1d1e);border:1px solid var(--line);
  border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.28);
  padding:4px;
}
html[data-theme="light"] .crm-ac-list{background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.12)}
.crm-ac-item{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  width:100%;text-align:left;border:0;background:transparent;
  color:var(--text);padding:8px 10px;border-radius:8px;cursor:pointer;
  font:inherit;
}
.crm-ac-item:hover,.crm-ac-item:focus{background:rgba(82,158,244,.12);outline:0}
.crm-ac-main{font-weight:600;font-size:13px;line-height:1.3}
.crm-ac-sub{font-size:12px;color:var(--muted);line-height:1.3}
.crm-ac-item--muted{cursor:default;color:var(--muted);font-size:12px}
.crm-ac-item--muted:hover{background:transparent}
.order-amount-split-row{margin-bottom:10px}
@media (max-width:1100px){
  .order-form-row--main,
  .order-form-row--main:has(> .field--refund),
  .order-form-layout--editor .order-form-row--main{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
  .order-form-row--meta,
  .order-form-layout--editor .order-form-row--meta{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}
@media (max-width:640px){
  .order-form-row--main,
  .order-form-row--main:has(> .field--refund),
  .order-form-layout--editor .order-form-row--main,
  .order-form-row--meta,
  .order-form-layout--editor .order-form-row--meta,
  .order-form-row--money,
  .order-form-row--contact,
  .order-form-row--address,
  .order-amount-split-row.cols-4{
    grid-template-columns:1fr;
    max-width:none;
  }
  .order-form-row--address .field--city,
  .order-form-row--address .field--street,
  .order-amount-split-row .field input[name="amount_processing"],
  .order-amount-split-row .field input[name="amount_print"],
  .order-amount-split-row .field input[name="urgent_amount"],
  .order-form-row--money .field--amount input{
    max-width:none;
  }
}
/* Единая «шапка списка»: форма-фильтр с одинаковыми подписями и ровной строкой действий */
.crm-filters .field>label{display:block;margin-bottom:4px;font-size:12px;color:var(--muted);font-weight:600}
.crm-filters .field input,.crm-filters .field select{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
.crm-filters .orders-filter-services{margin-top:10px;min-width:0}
.crm-filters .orders-filter-services .field{min-width:0}
.crm-filters .orders-filter-services select{min-width:0;max-width:100%}
/* Заказы: ширина полей по контексту, небольшие зазоры (не растягивать cols-4 на всю ширину) */
.crm-filters--orders .crm-filters-row{
  display:flex;flex-wrap:wrap;gap:10px 12px;align-items:flex-end;margin-top:10px;min-width:0
}
.crm-filters--orders .crm-filters-row:first-child{margin-top:0}
.crm-filters--orders .field{margin:0;min-width:0}
.crm-filters--orders .field--grow{flex:1 1 16rem;min-width:12rem}
.crm-filters--orders .field--sku{flex:0 1 9rem;width:9rem}
.crm-filters--orders .field--status{flex:0 1 10.5rem;width:10.5rem}
.crm-filters--orders .field--editor{flex:0 1 12rem;width:12rem}
.crm-filters--orders .field--sort{flex:1 1 16rem;max-width:22rem;min-width:14rem}
.crm-filters--orders .field--date{flex:0 0 10.25rem;width:10.25rem}
.crm-filters--orders .field--toggle{flex:0 0 auto;width:auto}
.crm-filters--orders .field--toggle .filter-toggle-btn{width:auto;max-width:none;white-space:nowrap}
.crm-filters--orders .field--svc-cat{flex:0 1 14rem;width:14rem;max-width:16rem}
.crm-filters--orders .field--svc-item{flex:0 1 16rem;width:16rem;max-width:20rem}
@media (max-width:720px){
  .crm-filters--orders .field--sku,
  .crm-filters--orders .field--status,
  .crm-filters--orders .field--editor,
  .crm-filters--orders .field--date,
  .crm-filters--orders .field--svc-cat,
  .crm-filters--orders .field--svc-item{flex:1 1 calc(50% - 8px);width:auto;max-width:none}
  .crm-filters--orders .field--grow,
  .crm-filters--orders .field--sort{flex:1 1 100%;max-width:none}
}
.crm-filter-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.crm-filter-actions .crm-filter-actions-spacer{margin-right:auto}
@media (max-width:640px){.crm-filter-actions{justify-content:stretch}.crm-filter-actions .btn{flex:1 1 auto}}
.table-wrap{overflow:auto;border-radius: var(--radius);border:1px solid var(--line);background:var(--card-bg)}
.table{width:100%;border-collapse:collapse;min-width:900px;background:var(--table-bg)}
.table.compact{min-width:760px}
.table th,.table td{padding:12px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.table.compact th,.table.compact td{padding:9px 10px}
.table th{
  font-size:12px;color:var(--muted);text-align:left;
  text-transform:none;letter-spacing:0;font-weight:500;
  background:var(--surface-inset);
}
.table tr:nth-child(even) td{background:rgba(148,163,184,.03)}
.table tr:hover td{background:rgba(148,163,184,.08)}
/* Числовые колонки: выравнивание вправо + табличные цифры (ровные разряды) */
.table td.num,.table th.num,.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
/* Липкая шапка таблицы — опционально (на длинных списках), внутренний скролл */
.table-wrap.table-wrap--sticky{max-height:72vh}
.table-wrap--sticky .table thead th{position:sticky;top:0;z-index:2;background:var(--surface-inset)}
/* Утилиты (замена частых инлайнов) */
.u-text-right{text-align:right}
.u-text-center{text-align:center}
.u-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.u-fw-700{font-weight:700}
.u-fw-800{font-weight:800}
.u-mt-8{margin-top:8px}.u-mt-12{margin-top:12px}.u-mt-14{margin-top:14px}
.u-nowrap{white-space:nowrap}
.u-w-1{width:1%}

/* Пагинация (единый партиал partials/pagination.php) */
.crm-pagination{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px;align-items:center}
.crm-pagination .btn,
.crm-pagination a{
  min-width:36px;min-height:36px;padding:6px 10px;border-radius:9px;font-size:13px;
}
.crm-pagination .btn.active,
.crm-pagination a.active{
  background:var(--surface-brand-soft);border-color:transparent;color:var(--brand);font-weight:700;
}

/* Баннер режима предпросмотра — компактная информационная плашка */
.preview-banner{display:flex;align-items:flex-start;gap:10px;margin:0 0 12px;padding:9px 12px;border:1px solid color-mix(in srgb,var(--violet) 35%,var(--line));background:var(--surface-violet-soft);border-radius:var(--radius-sm,8px);font-size:13px;line-height:1.45;color:var(--text)}
.preview-banner-icon{flex:none;color:var(--violet);font-size:15px;line-height:1.4}
.preview-banner-body{flex:1;min-width:0;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline}
.preview-banner-title{font-weight:800}
.preview-banner-text{color:var(--muted)}
.preview-banner code{font-size:12px}
.preview-banner-close{flex:none;background:none;border:0;color:var(--muted);font-size:17px;line-height:1;cursor:pointer;padding:0 2px;border-radius:6px}
.preview-banner-close:hover{color:var(--text)}
.preview-banner.is-hidden{display:none}

/* Блок «Требует внимания» на главной админа */
.attention-card{border-color:var(--line)}
.attention-card:not(.attention-card--ok){border-color:rgba(247,144,9,.35)}
.attention-card--ok{border-color:var(--line)}
.attention-head{margin-bottom:8px}
.attention-title{font-weight:700;font-size:15px;color:var(--text)}
.attention-items{display:flex;flex-wrap:wrap;gap:10px}
.attention-chip{display:inline-flex;align-items:center;gap:8px;text-decoration:none;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card-bg);box-shadow:none;transition:border-color .12s ease,background .12s ease}
.attention-chip:hover{border-color:var(--ring-brand);background:var(--surface-brand-soft)}
.attention-chip-n{font-weight:800;font-size:16px;line-height:1}
.attention-chip-l{color:var(--muted);font-size:13px}
.attention-chip--danger{border-color:transparent;background:var(--surface-danger-soft)}
.attention-chip--danger .attention-chip-n{color:var(--st-returned,#ef4444)}
.attention-chip--warn{border-color:transparent;background:rgba(247,144,9,.12)}
.attention-chip--warn .attention-chip-n{color:var(--st-active,#f59e0b)}

/* Кликабельная KPI-карточка: ведёт в отфильтрованный список */
a.kpi-link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit;transition:border-color .12s ease,background .12s ease}
a.kpi-link:hover{transform:none;border-color:var(--brand);background:var(--card-bg)}
a.kpi-link:hover .value{color:var(--brand)}
a.kpi-link::after{display:none}
a.kpi-link{position:relative}

/* Доступность: видимое кольцо фокуса при навигации с клавиатуры */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible,summary:focus-visible{
  outline:2px solid var(--ring-brand);
  outline-offset:2px;
  border-radius:8px;
}

/* Печать: только контент (без сайдбара/шапки/кнопок), чёрным по белому */
@media print{
  .sidebar,.topbar,.crm-section-tabs,.notifications-wrap,.notifications-banner,.notifications-dropdown,#sidebar-backdrop,.theme-switch,.crm-filter-actions,.btn,.sidebar-toggle{display:none !important}
  .app,.app--sidebar-open{display:block !important}
  .main,.main-body{padding:0 !important;margin:0 !important}
  body{background:#fff !important;color:#000 !important}
  .card{box-shadow:none !important;border:1px solid #ccc !important;background:#fff !important}
  .table th{background:#f2f2f2 !important;color:#000 !important}
  .table td,.table th{border-color:#ccc !important}
  a{color:#000 !important;text-decoration:none !important}
}
.table tr.tr-similar td{background:rgba(239,68,68,.08);border-left:3px solid rgba(239,68,68,.4)}
.table tr.tr-similar:hover td{background:rgba(239,68,68,.12)}
.order-warning{margin-top:6px;padding:4px 8px;border-radius:8px;background:rgba(245,158,11,.12);color:var(--warn);border:1px solid rgba(245,158,11,.35);font-size:11px;line-height:1.35}
.order-warning a{color:inherit;text-decoration:underline}
.order-warning-card li,
.order-warning-card .small{
  overflow-wrap:anywhere;
  word-break:break-word;
}
.crm-modal{
  position:fixed;
  inset:0;
  z-index:2000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  background:var(--backdrop-scrim);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
.crm-modal[hidden]{display:none !important}
.crm-modal__dialog{
  width:min(560px, 100%);
  max-width:100%;
  border-color:var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.crm-welcome-modal .crm-modal__dialog{
  width:min(392px, 100%);
  border-color:rgba(16,185,129,.35);
}
.crm-welcome-modal .crm-modal__dialog a{color:var(--brand);text-decoration:underline}
.crm-welcome-modal .card-h,
.crm-welcome-modal .card-b{
  padding:12px 14px;
}
.crm-welcome-modal #crm-welcome-title{
  font-size:15px;
  line-height:1.35;
}
.crm-welcome-modal .card-b{
  font-size:13px;
}
.crm-modal__actions{
  justify-content:flex-end;
}
body.crm-modal-open{
  overflow:hidden;
}
.crm-cookie-bar{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:1900;
  padding:12px max(16px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  background:rgba(15,23,42,.97);
  border-top:1px solid var(--line);
  box-shadow:0 -6px 28px rgba(0,0,0,.28);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
html[data-theme="light"] .crm-cookie-bar{
  background:rgba(255,255,255,.98);
}
.crm-cookie-bar[hidden],
.crm-cookie-bar.is-hidden{display:none !important}
.crm-cookie-bar__inner{
  max-width:920px;
  margin:0 auto;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px 18px;
  flex-wrap:wrap;
}
.crm-cookie-bar__body{flex:1;min-width:min(100%, 260px)}
.crm-cookie-bar__title{font-weight:800;font-size:13px;line-height:1.35;margin:0 0 4px}
.crm-cookie-bar__text{margin:0;font-size:12px;line-height:1.45;color:var(--muted)}
.crm-cookie-bar__text a{color:var(--brand);text-decoration:underline}
.crm-cookie-bar__actions{display:flex;gap:8px;flex-shrink:0;align-items:center;flex-wrap:wrap}
.crm-welcome-modal .crm-modal__dialog{border-color:rgba(16,185,129,.35)}
.crm-welcome-modal .crm-modal__dialog a{color:var(--brand);text-decoration:underline}
.table tr.tr-overdue td{background:rgba(239,68,68,.06);border-left:3px solid rgba(239,68,68,.5)}
.table tr.tr-overdue:hover td{background:rgba(239,68,68,.1)}
.table tr.tr-partial-payment td{background:rgba(239,68,68,.14);border-left:3px solid var(--danger)}
.table tr.tr-partial-payment:hover td{background:rgba(239,68,68,.18)}
.table tr.tr-overdue.tr-partial-payment td{background:rgba(239,68,68,.16)}
.timer.overdue{color:var(--danger);font-weight:800}
.th-client{width:220px;min-width:200px}.td-client{max-width:280px;min-width:200px}.th-editor{width:130px;min-width:110px}.th-creator{width:120px;min-width:100px}.th-date{width:150px}.th-actions{min-width:180px;width:auto}
.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;font-size:12px;border:1px solid var(--line)}
.badge.ok{color:var(--st-completed);border-color:rgba(34,197,94,.4);background:rgba(34,197,94,.12)}
button.badge.badge-toggle{
  cursor:pointer;
  font:inherit;
  font-weight:700;
  line-height:1.2;
  appearance:none;
  -webkit-appearance:none;
  transition:transform .12s ease, filter .12s ease;
}
button.badge.badge-toggle:hover{filter:brightness(1.08)}
button.badge.badge-toggle:active{transform:scale(.96)}
.svc-active-toggle{display:inline;margin:0;padding:0}
.td-svc-actions{
  white-space:nowrap;
  min-width:168px;
  position:relative;
  z-index:2;
}
.td-shift-actions{
  white-space:nowrap;
  min-width:118px;
  position:relative;
  z-index:2;
  padding-right:22px;
}
.shift-save-form{
  display:inline;
  margin:0;
}
.td-svc-actions .svc-delete-form{
  display:inline-flex;
  margin:0;
  vertical-align:middle;
}
.badge.delivery{color:var(--st-delivery);border-color:rgba(14,165,233,.45);background:rgba(14,165,233,.12)}
.badge.printing{color:var(--st-printing);border-color:rgba(168,85,247,.45);background:rgba(168,85,247,.12)}
.badge.warn{color:var(--st-active);border-color:rgba(245,158,11,.4);background:rgba(245,158,11,.12)}
.badge.danger{color:var(--st-returned);border-color:rgba(239,68,68,.4);background:rgba(239,68,68,.12)}
.badge.muted{color:var(--muted);background:rgba(148,163,184,.06)}
.flash{padding:12px;border-radius:14px;border:1px solid var(--line);margin-bottom:12px;display:flex;align-items:flex-start;gap:10px}.flash.success,.flash.ok{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.3)}.flash.error{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.3)}.flash.info{background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.28)}
.flash .flash-msg{flex:1;min-width:0}
.flash .flash-close{flex:none;background:none;border:0;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;padding:0 2px;border-radius:6px}
.flash .flash-close:hover{color:var(--text)}
.flash.flash-hide{opacity:0;transform:translateY(-6px);transition:opacity .35s ease,transform .35s ease}
.timer{font-weight:800;letter-spacing:.2px}.timer.overdue{color:var(--danger)}
.small{color:var(--muted);font-size:12px}.footer{color:var(--muted);font-size:12px}
/* Гостевой /login: один экран — карточка по центру, без сайдбара и «Меню» (на iPhone не дублируется шапка) */
.body--guest-login{overflow-x:hidden}
.app--guest-login{
  display:block;
  min-height:100vh;
  min-height:100dvh;
  max-width:1366px;
  width:100%;
  margin-inline:auto;
}
.main--guest-login{
  padding:max(20px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(28px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  min-height:100vh;
  min-height:100dvh;
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:stretch;
}
.login-page{width:100%;max-width:440px;margin:0 auto}
.login-card{width:100%}
.login-card__head{padding-bottom:4px}
.login-brand__logo,
.brand-full-logo__img{
  display:block;
  width:auto;
  max-width:min(240px, 72vw);
  height:clamp(26px, 7vw, 36px);
  object-fit:contain;
  object-position:center center;
  flex-shrink:0;
  margin-inline:auto;
}
.login-brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  gap:10px;
  text-align:center;
}
.login-brand__sub{color:var(--muted);font-size:13px;line-height:1.35}
/* Login/register dark: лого белое на тёмной карточке (размер без изменений) */
html:not([data-theme="light"]) .login-brand__logo{
  filter:brightness(0) invert(1);
}
.login-actions{display:flex;flex-direction:column;gap:8px}
.login-actions .btn{width:100%}
.login-back-site{text-align:center}
.login-submit{width:100%;margin-top:6px}
.login-footnote{margin-top:14px;line-height:1.45}
.login-version{margin-top:10px;opacity:.78}
.login-footnote a{color:var(--brand);text-decoration:underline}
.login-footnote a:hover{opacity:1}
.login-rules-em{font-weight:800;color:var(--brand)}
/* Дашборд редактора: текст правил без класса .separator (у .separator height:1px — ломает контент) */
.editor-dashboard-page{
  display:flex;
  flex-direction:column;
  gap:20px;
  min-width:0;
  max-width:100%;
}
/* Главная редактора и страница «Конкурсы» (админ): единые крупные шрифты для рейтингов и связанных блоков. */
.editor-home-dashboard{
  font-size:15px;
}
.editor-home-dashboard .editor-dashboard-welcome{
  font-size:15px;
}
.editor-home-dashboard .editor-dashboard-welcome strong{
  font-size:16px;
}
.editor-home-dashboard .small{
  font-size:13px;
}
.editor-home-dashboard .editor-ranking-card .card-h > div:first-child{
  font-size:17px;
}
.editor-home-dashboard .editor-ranking-card .card-h .editor-ranking-prize-note{
  font-size:13px;
  line-height:1.5;
}
.editor-home-dashboard .editor-rankings-grid .table th{
  font-size:13px;
}
.editor-home-dashboard .editor-rankings-grid .table td{
  font-size:14px;
}
.editor-home-dashboard .editor-monthly-winner-panel__title{
  font-size:14px;
}
.editor-home-dashboard .editor-monthly-winner-panel__lead{
  font-size:14px;
}
.editor-home-dashboard .editor-monthly-winner-panel__meta{
  font-size:13px;
}
.editor-dashboard-welcome-card{
  min-width:0;
  margin-bottom:0;
  position:relative;
  z-index:1;
}
.editor-dashboard-welcome-card .card-b{padding:16px 16px 18px}
.editor-dashboard-welcome{
  margin:0;
  padding:0;
  border:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
  overflow:visible;
  max-width:100%;
  word-wrap:break-word;
  overflow-wrap:break-word;
}
.editor-dashboard-welcome strong{color:var(--text);font-size:14px}
.editor-dashboard-welcome ol{margin:10px 0 0;padding-left:1.35em}
.editor-dashboard-welcome li{margin-top:6px;padding-left:2px}
.editor-rankings-grid{
  margin:0;
  gap:18px;
  align-items:stretch;
  min-width:0;
}
.editor-ranking-card{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.editor-ranking-card .card-h{
  flex-shrink:0;
  padding-bottom:4px;
}
.editor-ranking-card .card-h > div:first-child{
  word-break:break-word;
  overflow-wrap:break-word;
}
.editor-ranking-card .card-h .editor-ranking-prize-note{
  margin-top:8px;
  line-height:1.45;
  color:var(--muted);
  font-size:11px;
  max-width:100%;
}
.editor-ranking-card .card-h .editor-ranking-prize-note strong{
  color:var(--text);
  font-weight:700;
}
.editor-ranking-card .card-b{
  flex:1;
  min-width:0;
  padding-top:10px;
}
/* Без внутренней полосы прокрутки: таблица ужимается в колонку сетки */
.editor-rankings-grid .table-wrap{
  border:1px solid var(--line);
  overflow:visible;
  max-width:100%;
}
.editor-rankings-grid .table.table-editor-ranking{
  table-layout:fixed;
  width:100%;
  min-width:0;
}
.editor-rankings-grid .th-rank,
.editor-rankings-grid .td-rank{
  width:3.5rem;
  min-width:3.25rem;
  max-width:3.75rem;
  text-align:center;
  white-space:normal;
  vertical-align:middle;
  padding-left:4px;
  padding-right:4px;
}
.editor-rankings-grid .rank-chip{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0;
  line-height:1;
  max-width:100%;
}
.editor-rankings-grid .rank-chip__ico{
  font-size:12px;
  line-height:1;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.4));
}
.editor-rankings-grid .rank-chip__num{
  font-size:11px;
  font-weight:800;
  letter-spacing:-0.02em;
  margin-top:1px;
}
.editor-rankings-grid .rank-chip__stars{
  font-size:6px;
  line-height:1;
  letter-spacing:-0.12em;
  margin-top:1px;
  color:#fbbf24;
}
.editor-rankings-grid .rank-chip--gold .rank-chip__num{color:#fde68a;text-shadow:none;}
.editor-rankings-grid .rank-chip--silver .rank-chip__num{color:#e2e8f0;}
.editor-rankings-grid .rank-chip--bronze .rank-chip__num{color:#fdba74;}
/* Места 4+: заметнее, чем старый «plain», но слабее топ-3 */
.editor-rankings-grid .rank-chip--rest{
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:2px 0;
}
.editor-rankings-grid .rank-chip--rest .rank-chip__ico{
  font-size:11px;
  line-height:1;
  opacity:.95;
  filter:none;
}
.editor-rankings-grid .rank-chip--rest .rank-chip__num{
  color:var(--violet2);
  font-size:11px;
  font-weight:700;
  padding:3px 8px;
  border-radius:var(--radius-sm,8px);
  margin-top:1px;
  background:var(--surface-violet-soft);
  border:1px solid color-mix(in srgb, var(--violet) 35%, var(--line));
  box-shadow:none;
  text-shadow:none;
}
.contests-admin-page .contests-admin-intro{margin-bottom:0}
.contests-admin-page .contests-admin-intro .card-b{padding:16px 16px 18px}
.contests-admin-intro__title{
  margin:0 0 8px;
  font-weight:800;
  font-size:17px;
  letter-spacing:.02em;
  color:var(--text);
}
.editor-home-dashboard .contests-admin-intro__text{
  line-height:1.55;
}
.contests-admin-code{
  font-size:12px;
  padding:2px 6px;
  border-radius:8px;
  background:var(--code-bg);
  border:1px solid var(--line);
  color:var(--code-fg);
  word-break:break-all;
}
.editor-rankings-grid .th-completed,
.editor-rankings-grid .td-completed{
  width:6.75rem;
  text-align:right;
  white-space:nowrap;
}
.editor-rankings-grid .th-editor-name,
.editor-rankings-grid .td-editor-name{
  word-break:break-word;
  overflow-wrap:break-word;
  hyphens:auto;
}
.editor-rankings-grid .editor-ranking-empty{padding:14px 12px;vertical-align:top;color:var(--muted)}
.editor-ranking-card .card-h,.editor-ranking-card .card-b{min-width:0}
.editor-monthly-winner-panel{
  display:flex;
  gap:12px;
  align-items:flex-start;
  margin-top:14px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(251,191,36,.35);
  background:linear-gradient(135deg, rgba(251,191,36,.12), rgba(16,185,129,.08));
  min-width:0;
}
.editor-monthly-winner-panel--empty{
  border-color:var(--line);
  background:rgba(148,163,184,.06);
}
.editor-monthly-winner-panel__badge{
  font-size:22px;
  line-height:1;
  flex-shrink:0;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.25));
}
.editor-monthly-winner-panel__body{min-width:0;flex:1}
.editor-monthly-winner-panel__title{
  font-weight:800;
  font-size:13px;
  color:var(--text);
  letter-spacing:.02em;
  margin-bottom:6px;
}
.editor-monthly-winner-panel__lead{
  margin:0 0 8px;
  font-size:13px;
  line-height:1.5;
  color:var(--text);
}
.editor-monthly-winner-panel__list{
  margin:6px 0 10px;
  padding-left:1.25em;
  color:var(--text);
  font-size:13px;
  line-height:1.5;
}
.editor-home-dashboard .editor-monthly-winner-panel__list{
  font-size:14px;
}
.editor-monthly-winner-panel__name{font-weight:700;color:#fde68a}
.editor-monthly-winner-panel--empty .editor-monthly-winner-panel__name{color:inherit}
.editor-monthly-winner-panel__hint{display:block;margin-top:6px;color:var(--muted);line-height:1.4}
.editor-monthly-winner-panel__meta{margin:0;color:var(--muted);line-height:1.45}
@media (max-width:1080px){
  .grid.cols-2.editor-rankings-grid{grid-template-columns:1fr}
}
.stack{display:flex;flex-direction:column;gap:6px}.inline-form{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.separator{height:1px;background:var(--line);margin:8px 0}
.table-note{max-width:280px;white-space:normal}.muted-text{color:var(--muted)}
.audit-icon-cell{display:flex;align-items:center;gap:6px;white-space:nowrap}
.audit-icon{flex:0 0 16px;width:16px;height:16px;object-fit:contain;opacity:.92}
.audit-icon-stack{display:inline-flex;align-items:center;gap:2px;flex:0 0 auto}
@media (max-width:1024px){
  /* iPhone (в т.ч. альбом): узкий режим до 1024px. Высоту шапки задаёт app.js → --shell-topbar-offset */
  :root{
    --shell-topbar-offset: 48px;
  }
  .app{display:block;position:relative}
  .sidebar-toggle{display:inline-flex !important;touch-action:manipulation}
  .sidebar-close{display:inline-flex !important;align-items:center;justify-content:center;touch-action:manipulation}
  /* Шапка с «Меню» — поверх выезжающей панели (иначе iOS/WebKit перекрывает клики) */
  .app:not(.app--guest-login) .topbar{
    position:fixed;
    z-index:1310;
    top:env(safe-area-inset-top, 0px);
    left:0;
    right:0;
    margin:0;
    margin-bottom:0 !important;
    padding:4px 10px;
    padding-left:max(10px, env(safe-area-inset-left, 0px));
    padding-right:max(10px, env(safe-area-inset-right, 0px));
    background:var(--topbar-mobile-bg);
    border-bottom:1px solid var(--line);
    box-shadow:0 4px 16px rgba(0,0,0,.28);
    max-width:100%;
    box-sizing:border-box;
    flex-wrap:nowrap;
    align-items:center;
    row-gap:0;
    gap:6px;
    min-height:0;
  }
  /* Одна строка: ☰ Меню + заголовок слева, тема/чаты/звук/🔔 справа */
  .app:not(.app--guest-login) .topbar{
    flex-wrap:nowrap;
    width:100%;
    max-width:100vw;
  }
  .app:not(.app--guest-login) .topbar-heading{
    flex:1 1 auto;
    min-width:0;
    align-items:center;
    gap:6px;
  }
  .app:not(.app--guest-login) .topbar-titles{
    min-width:0;
    flex:1 1 auto;
    overflow:hidden;
  }
  /* В фиксированной однострочной шапке крошки ломают высоту — только заголовок */
  .app:not(.app--guest-login) .crm-breadcrumbs{
    display:none;
  }
  .app:not(.app--guest-login) .topbar-titles > div:first-child,
  .app:not(.app--guest-login) .topbar-title{
    font-size:15px;
    font-weight:700;
    line-height:1.2;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
  }
  .app:not(.app--guest-login) .topbar-titles .small{
    display:none;
  }
  /* Имя в шапке — только аватар на узких экранах */
  .app:not(.app--guest-login) .topbar-user__name{
    display:none;
  }
  .app:not(.app--guest-login) .topbar-center-title{
    font-size:15px;
    font-weight:700;
    line-height:1.2;
    gap:6px;
  }
  .app:not(.app--guest-login) .topbar-right{
    flex:0 0 auto;
    width:auto;
    max-width:none;
    justify-content:flex-end;
    flex-wrap:nowrap;
    margin-left:0;
    margin-top:0;
    padding-left:0;
    gap:2px;
  }
  .app:not(.app--guest-login) .topbar-right .theme-switch__btn,
  .app:not(.app--guest-login) .topbar-right .btn{
    min-width:32px;
    min-height:32px;
    padding:4px 6px;
  }
  .app:not(.app--guest-login) .topbar-user{
    max-width:none;
    padding:2px;
    gap:0;
    font-size:12px;
    border-radius:999px;
  }
  .app:not(.app--guest-login) .topbar-user .nav-avatar{
    width:28px;
    height:28px;
  }
  .app:not(.app--guest-login) .msg-top-wrap{gap:2px}
  .app:not(.app--guest-login) .msg-top-chats{min-width:32px;padding:4px 6px}
  .app:not(.app--guest-login) .sidebar-toggle{
    padding:4px 8px;
    min-height:32px;
    min-width:32px;
    font-size:13px;
    gap:4px;
  }
  .app:not(.app--guest-login) .sidebar-toggle-icon{font-size:16px}
  .app:not(.app--guest-login) .msg-tools-gear--top{
    width:32px;
    height:32px;
    min-width:32px;
    border-radius:10px;
  }
  .app:not(.app--guest-login) .msg-tools-gear--top::before{font-size:15px}
  body{overflow-x:hidden}
  .app{max-width:100%;overflow-x:hidden}
  /* Открыто меню: клики уходят на затемнение, шапка остаётся кликабельной */
  .app--sidebar-open .main{
    pointer-events:none;
  }
  .app--sidebar-open .main .topbar{
    pointer-events:auto;
  }
  .sidebar{
    position:fixed;
    left:0;
    top:var(--shell-topbar-offset, 56px);
    bottom:env(safe-area-inset-bottom, 0px);
    z-index:1250;
    height:auto;
    width:max-content;
    min-width:min(260px,72vw);
    max-width:min(92vw,400px);
    padding:16px 14px 20px;
    padding-left:max(14px, env(safe-area-inset-left, 0px));
    padding-bottom:max(20px, env(safe-area-inset-bottom, 0px));
    -webkit-transform:translate3d(-105%,0,0);
    transform:translate3d(-105%,0,0);
    transition:transform .22s ease,-webkit-transform .22s ease;
    overflow:hidden;
    overscroll-behavior:contain;
    box-shadow:4px 0 28px rgba(0,0,0,.45);
    border-right:1px solid var(--line);
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    overflow:hidden;
  }
  .app--sidebar-open .sidebar{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
  .sidebar .nav a{white-space:nowrap}
  .sidebar-backdrop{
    display:block;
    position:fixed;
    inset:0;
    z-index:1240;
    margin:0;
    border:0;
    padding:0;
    background:var(--backdrop-scrim);
    -webkit-backdrop-filter:blur(3px);
    backdrop-filter:blur(3px);
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .2s ease,visibility .2s;
  }
  .app--sidebar-open .sidebar-backdrop{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
  .notifications-dropdown{
    z-index:1320;
  }
  @media (prefers-reduced-motion:reduce){
    .sidebar{transition:none}
    .sidebar-backdrop{transition:none}
  }
  .grid.cols-4{grid-template-columns:1fr 1fr}
  .grid.cols-3{grid-template-columns:1fr}
  .grid.cols-3.order-create-services-grid{grid-template-columns:1fr}
  .row.cols-4{grid-template-columns:1fr 1fr}
  .row.cols-3{grid-template-columns:1fr}
}
@media (max-width:520px){.grid.cols-4{grid-template-columns:1fr}.row.cols-2{grid-template-columns:1fr}}

.orders-table{min-width:1280px}.orders-quick-form{margin:0}.orders-quick-row{display:flex;gap:5px;align-items:center;flex-wrap:wrap;font-size:12px}.orders-field-status{max-width:100px;min-width:80px;font-weight:600}
.orders-field-status.orders-status-active{color:var(--st-active);border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.1)}
.orders-field-status.orders-status-completed{color:var(--st-completed);border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.1)}
.orders-field-status.orders-status-printing{color:var(--st-printing);border-color:rgba(168,85,247,.5);background:rgba(168,85,247,.1)}
.orders-field-status.orders-status-in_delivery{color:var(--st-delivery);border-color:rgba(14,165,233,.5);background:rgba(14,165,233,.1)}
.orders-field-status.orders-status-returned{color:var(--st-returned);border-color:rgba(239,68,68,.5);background:rgba(239,68,68,.1)}.orders-field-editor{width:100%;max-width:140px;min-width:90px}.orders-field-amount{width:100%;max-width:90px;min-width:70px}.td-client .small{display:block;margin-top:4px}.td-client>div:first-child{white-space:normal;word-break:break-word}.td-client .order-client-category{display:block;margin-top:4px;white-space:normal;word-wrap:break-word;overflow-wrap:anywhere;line-height:1.35;max-width:100%}.td-client .order-prepaid-hint,.td-amount-inline .order-prepaid-hint,.orders-table td .order-prepaid-hint{display:block;margin-top:4px;font-weight:700;font-size:11px;line-height:1.25;color:var(--danger)}.td-creator{max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.client-name-one-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.cell-client-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.td-editor-inline,.td-amount-inline,.td-status-inline{padding:6px 8px;vertical-align:middle}.td-editor-inline select,.td-amount-inline input,.td-status-inline select{width:100%;max-width:100%;padding:6px 8px;font-size:12px}
.td-quick-actions{white-space:normal;min-width:180px;overflow:visible}.td-quick-actions .orders-quick-row{flex-direction:column;align-items:flex-start;gap:6px}.td-quick-actions .orders-quick-row-top{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.td-quick-actions .btn.small{padding:6px 10px;font-size:12px;white-space:nowrap}.td-quick-actions .orders-quick-form{min-width:0}


/* TailAdmin: strong KPI = same card surface, brand value (не заливка всей карточки) */
.kpi.strong{background:var(--card-bg);border-color:var(--line)}
.kpi.strong .value{color:var(--brand)}
.metric-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.metric-pill{
  padding:20px 24px;border-radius:var(--radius);border:1px solid var(--line);
  background:var(--card-bg);display:flex;flex-direction:column;gap:6px;
  min-height:78px;height:100%;justify-content:flex-start;
  box-shadow:none;
}
.attention-chip{
  display:inline-flex;align-items:center;gap:8px;text-decoration:none;
  padding:8px 14px;border-radius:999px;border:1px solid var(--line);
  background:var(--card-bg);box-shadow:none;
  transition:border-color .12s ease,background .12s ease;
}
.metric-pill__label{font-size:12px;font-weight:500;color:var(--muted)}
.metric-pill__value{font-size:18px;font-weight:800;color:var(--text);letter-spacing:-.01em}
.metric-pill__hint{font-size:11px;color:var(--muted);margin-top:auto;padding-top:4px}
.chart-card .card-b{padding-top:12px}
.chart-title{font-weight:700;font-size:16px;letter-spacing:0;color:var(--text)}
.chart-card .card-h .small{color:var(--muted);font-weight:400;margin-top:4px}
.chart-wrap{
  position:relative;height:320px;border:0;border-radius:12px;
  padding:8px 4px 4px;background:transparent;
}
.chart-wrap--donut{height:340px}
.chart-canvas{width:100%;height:100%}
.chart-card{min-width:0}
.chart-table-wrap{
  border-radius:12px;
  min-width:0;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  border:1px solid var(--line);
}
/* Редакторы за период: ширина колонки по max(заголовок, содержимое); вертикальные разделители между колонками */
/* Важно: в разметке стоит class="table compact chart-table" — глобальные .table/.table.compact задают width:100% и min-width 760–900px и растягивают таблицу; ниже это сбрасывается */
.table.chart-table,
.table.compact.chart-table{
  width:max-content;
  max-width:100%;
  min-width:0;
}
.chart-table{
  border-collapse:collapse;
  table-layout:auto;
  width:max-content;
  max-width:100%;
  min-width:0;
}
.chart-table th,
.chart-table td{
  padding:6px 8px;
  vertical-align:middle;
  border-right:1px solid rgba(148,163,184,.28);
}
.chart-table th:last-child,
.chart-table td:last-child{border-right:none}
.chart-table thead th{
  border-bottom:1px solid rgba(148,163,184,.35);
  white-space:nowrap;
  font-weight:700;
  font-size:12px;
  color:var(--muted);
}
.chart-table th:first-child,
.chart-table td:first-child{text-align:left}
.chart-table th:nth-child(n+2),
.chart-table td:nth-child(n+2){text-align:right}
.chart-table td:first-child{
  white-space:normal;
  word-wrap:break-word;
  overflow-wrap:anywhere;
  line-height:1.25;
}
.chart-table td.chart-editor-name{
  font-weight:700;
  overflow-wrap:normal;
  word-break:normal;
}
.chart-table td.chart-editor-name .chart-editor-name__first{white-space:nowrap}
.chart-table td.chart-editor-name .chart-editor-name__rest{
  white-space:normal;
  word-break:normal;
  overflow-wrap:normal;
}
.chart-table td.chart-editor-name--on{color:var(--brand2)}
.chart-table td.chart-editor-name--off{color:var(--danger)}
.chart-table td:nth-child(n+2){
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
@media (max-width:720px){
  .chart-table th,
  .chart-table td{padding:5px 6px;font-size:12px}
  .chart-table thead th{font-size:11px}
}
.service-list{display:grid;gap:8px}
.service-item{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:rgba(148,163,184,.04)}
.service-item__main{min-width:0;flex:1 1 auto}
.service-item__name{font-weight:700}
.service-item__tail{display:flex;align-items:center;gap:8px;flex:0 0 auto;flex-wrap:wrap;justify-content:flex-end}
.service-item__sum{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}
.service-item__meta{font-size:12px;color:var(--text);padding:6px 10px;border-radius:999px;background:rgba(16,185,129,.14);border:1px solid rgba(16,185,129,.22)}
@media (max-width:1024px){.metric-strip{grid-template-columns:1fr 1fr}.chart-wrap,.chart-wrap--donut{height:300px}}
@media (max-width:520px){.metric-strip{grid-template-columns:1fr}}

/* Блок периода на главной: кастомный X-скролл (CrmScrollbar), как у chart-table */
.dashboard-period-card .card-b{padding:11px 13px}
.dashboard-period-row > [data-scrollbar="cropped"],
.dashboard-period-row > [data-scrollbar="cropped"].crm-sbar-cropped--period{
  flex:1 1 auto !important;
  width:auto;
  max-width:100%;
  min-width:0;
  align-self:center;
  overflow:hidden;
  display:block;
  padding-bottom:0;
}
.dashboard-period-row > [data-scrollbar="cropped"] > .dashboard-period-presets-scroll,
.dashboard-period-row > [data-scrollbar="cropped"] > [data-scrollbar="scrollable"].dashboard-period-presets-scroll{
  flex:none !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:none !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  padding-bottom:12px;
  margin-bottom:0;
  box-sizing:border-box;
}
.dashboard-period-label{margin-bottom:8px;color:var(--muted);font-size:12px;line-height:1.3}
/* Главная: пресеты + «С / По / Применить» в одной строке; форма справа от «Весь год».
   Пресеты сжимаются/скроллятся — без наложения при открытом сайдбаре. Размер ~−20%. */
.dashboard-period-row{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:6px 8px;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow-x:hidden;
  overflow-y:hidden;
}
.dashboard-period-presets-scroll{
  flex:1 1 auto;
  align-self:center;
  width:auto;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden; /* только горизонталь — CrmScrollbar рисует sbarThumbX */
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  box-sizing:border-box;
}
.dashboard-period-presets-scroll .btn-group-period{
  flex-wrap:nowrap;
  width:max-content;
  max-width:none;
  gap:2px;
  padding:4px;
  border-radius:999px;
  background:var(--surface-inset);
  border:1px solid var(--line);
}
.btn-group-period{display:flex;gap:8px;flex-wrap:wrap;flex:1 1 auto;min-width:0}
.btn-period{padding:12px 14px;font-size:14px;min-width:0;white-space:nowrap;text-align:center}
.dashboard-period-card .btn-period{
  padding:8px 14px;
  font-size:13px;
  font-weight:500;
  line-height:1.25;
  border-radius:999px;
  min-height:34px;
  box-sizing:border-box;
  background:transparent;
  border-color:transparent;
  color:var(--muted);
  box-shadow:none;
}
.dashboard-period-card .btn-period:hover{
  background:transparent;
  color:var(--text);
}
.dashboard-period-card .btn-period.active{
  background:var(--card-bg);
  border-color:transparent;
  color:var(--text);
  font-weight:600;
  box-shadow:0 1px 2px rgba(16,24,40,.06);
}
html:not([data-theme="light"]) .dashboard-period-card .btn-period.active{
  background:var(--surface-nested);
  box-shadow:none;
  color:var(--text);
}
.dashboard-period-custom{
  margin:0;
  padding:0;
  border:0;
  display:inline-flex;
  flex-wrap:nowrap;
  align-items:center;
  align-self:center;
  gap:6px 8px;
  flex:0 0 auto;
  min-width:0;
  max-width:none;
  box-sizing:border-box;
}
.dashboard-period-date-mod{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:5px;
  flex:0 0 auto;
  min-width:0;
  min-height:37px;
  padding:0 8px 0 6px;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(148,163,184,.06);
  box-sizing:border-box;
}
.dashboard-period-date-mod label{
  margin:0;
  font-size:11px;
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
  color:var(--muted);
  flex:0 0 auto;
  line-height:1;
}
.dashboard-period-custom input[type="date"]{
  width:auto;
  min-width:5.4rem;
  max-width:7rem;
  font-size:11px;
  font-variant-numeric:tabular-nums;
  padding:8px;
  box-sizing:border-box;
  min-height:0;
  height:auto;
  line-height:1.25;
  border-radius:10px;
}
.dashboard-period-custom input[type="date"]::-webkit-datetime-edit-fields-wrapper{
  padding:0;
}
.dashboard-period-date-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  padding-bottom:0;
}
/* как у .btn-period в блоке периода: одна линия с пресетами, −20% */
.dashboard-period-date-actions .btn.primary{
  white-space:nowrap;
  padding:9px 14px;
  font-size:11px;
  font-weight:600;
  border-radius:10px;
  min-height:37px;
  box-sizing:border-box;
}
.editors-table-compact .table th,.editors-table-compact .table td{padding:6px 8px;font-size:13px}

/* Профиль редактора: таблица смен — вертикальные разделители между столбцами */
.table.compact.editor-shift-table{
  border-collapse:collapse;
}
.table.compact.editor-shift-table th,
.table.compact.editor-shift-table td{
  border-right:1px solid rgba(148,163,184,.28);
  vertical-align:middle;
}
.table.compact.editor-shift-table th:last-child,
.table.compact.editor-shift-table td:last-child{
  border-right:none;
}
.table.compact.editor-shift-table thead th{
  border-bottom:1px solid rgba(148,163,184,.35);
}
.schedules-table th,.schedules-table td{padding:8px 10px}
.schedules-editor-cell{display:inline-flex;align-items:center;gap:8px;min-width:0}
.schedules-editor-tag{color:var(--muted);white-space:nowrap}
.schedules-row--disabled td{opacity:.72}
.duty-dot{
  width:10px;height:10px;border-radius:50%;flex:0 0 auto;
  box-shadow:0 0 0 2px rgba(15,23,42,.2);
  background:#64748b;
}
.duty-dot--on{background:#22c55e;box-shadow:0 0 0 2px rgba(34,197,94,.25)}
.duty-dot--off{background:#ef4444;box-shadow:0 0 0 2px rgba(239,68,68,.22)}
.duty-dot--disabled{background:#94a3b8;box-shadow:0 0 0 2px rgba(148,163,184,.25)}
html[data-theme="light"] .duty-dot{box-shadow:0 0 0 2px rgba(148,163,184,.35)}
html[data-theme="light"] .duty-dot--on{box-shadow:0 0 0 2px rgba(34,197,94,.3)}
html[data-theme="light"] .duty-dot--off{box-shadow:0 0 0 2px rgba(239,68,68,.28)}

.topbar-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:flex-end;min-width:0;max-width:100%}
.topbar-editors-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:flex-end;min-width:0;max-width:100%}
.topbar-editors-actions .btn-group{flex:0 1 auto;min-width:0}
.topbar-actions .btn{flex:0 1 auto;min-width:0}
/* Дубли ссылок из шапки: на мобилке достаточно бокового меню */
@media (max-width:1024px){
  .topbar-actions{display:none}
}
.notifications-wrap{position:relative;z-index:60;overflow:visible}
.notifications-wrap.is-open{z-index:70}
.notifications-bell{position:relative;padding:8px 12px;min-width:44px}
.notifications-bell-icon{font-size:18px}
.notifications-bell-count{position:absolute;top:2px;right:2px;min-width:18px;height:18px;padding:0 5px;font-size:11px;font-weight:800;color:#fff;background:var(--danger);border-radius:999px;display:inline-flex;align-items:center;justify-content:center}
.notifications-bell-count:empty,.notifications-bell-count[data-count="0"]{display:none}
/* Одно цельное окно: шапка + список + футер в одном flex-карточном контейнере */
.notifications-dropdown{
  position:absolute;right:0;top:100%;margin-top:6px;
  min-width:400px;max-width:min(520px,90vw);width:max-content;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-lg, var(--shadow));
  z-index:1200;max-height:min(420px,70vh);
  display:flex;flex-direction:column;overflow:hidden;
  isolation:isolate;
}
.notifications-dropdown[hidden]{display:none !important;visibility:hidden !important;pointer-events:none !important}
.notifications-dropdown-h{
  flex:0 0 auto;padding:12px 14px;font-weight:700;font-size:14px;
  border-bottom:1px solid var(--line);background:var(--panel);
}
.notifications-dropdown-list{
  flex:1 1 auto;overflow:auto;padding:8px;min-width:0;min-height:0;
  background:var(--panel);
}
.notifications-dropdown-item{padding:10px 12px;border-radius:12px;background:rgba(148,163,184,.06);border:1px solid var(--line);margin-bottom:6px;word-wrap:break-word;overflow-wrap:break-word}
.notifications-dropdown-item.read{opacity:.75}
.notifications-dropdown-item .n-title{font-weight:700;font-size:13px;word-wrap:break-word;overflow-wrap:break-word}
.notifications-dropdown-item .n-body{font-size:12px;color:var(--muted);margin-top:4px;word-wrap:break-word;overflow-wrap:break-word;white-space:pre-wrap}
.notifications-dropdown-item .n-actions{margin-top:8px}
.notifications-dropdown-footer{
  flex:0 0 auto;padding:10px 12px;border-top:1px solid var(--line);
  background:var(--panel);
}
/* Scrollbar-host внутри dropdown — не ломать единое окно */
.notifications-dropdown > .crm-sbar-cropped{
  flex:1 1 auto;min-height:0;min-width:0;
  display:flex;flex-direction:column;
  background:var(--panel);
}
.notifications-dropdown > .crm-sbar-cropped > [data-scrollbar="scrollable"]{
  flex:1 1 auto;min-height:0;overflow:auto;
}
.notifications-dropdown-push{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  padding:10px 12px;border-top:1px solid var(--line);
  background:var(--surface-inset, rgba(148,163,184,.04));
}
.notifications-push-status{font-size:12px;color:var(--muted);font-weight:600;min-width:0}
.notifications-push-status.is-on{color:#22c55e}
.notifications-push-status.is-off{color:var(--muted)}
.notifications-push-status.is-blocked{color:var(--danger,#ef4444)}
.a2hs-sheet__cta{width:100%;margin:0 0 8px;justify-content:center}
.notifications-banner{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 16px;margin-bottom:12px;background:rgba(16,185,129,.15);border:1px solid rgba(16,185,129,.35);border-radius:var(--radius);width:100%;max-width:100%;box-sizing:border-box}
.notifications-banner[hidden]{display:none}
.notifications-banner-text{flex:1;min-width:0;font-weight:600;word-wrap:break-word}
.table tr.tr-unread td{background:rgba(16,185,129,.08)}
.table tr.tr-unread:hover td{background:rgba(16,185,129,.12)}

/* ========== Адаптивность: телефоны и узкие окна (логика сайта не меняется) ========== */
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
.table-wrap{
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  max-width:100%;
}
/* Формы фильтров: поля на всю ширину на узком экране */
.form-filter-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:flex-end;
}
.form-filter-row .field{
  flex:1 1 auto;
  min-width:min(100%,200px);
  margin-bottom:0;
}
.form-filter-row .field--grow{
  flex:1 1 220px;
  min-width:min(100%,220px);
}
.form-filter-row .field--submit{
  flex:0 0 auto;
}
/* Быстрое добавление заказа (редактор): перенос строк вместо горизонтального обрезания */
.editor-all-orders-quick{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:flex-end;
}
.editor-all-orders-quick .field{
  flex:1 1 160px;
  min-width:0;
  margin-bottom:0;
}
.editor-all-orders-quick .field--client{
  flex:2 1 220px;
}
.editor-all-orders-quick .field--phone{
  flex:1 1 180px;
}
.editor-all-orders-quick .field--source{
  flex:1 1 140px;
}
.editor-all-orders-quick .field--status{
  flex:1 1 150px;
}
.editor-all-orders-quick .field input,
.editor-all-orders-quick .field select{
  max-width:100%;
  min-width:0;
}
@media (max-width:640px){
  .editor-all-orders-quick .field{
    flex:1 1 calc(50% - 6px);
    min-width:140px;
  }
  .editor-all-orders-quick .field:first-child{
    flex:1 1 100%;
  }
  .btn-group.order-form-actions{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .btn-group.order-form-actions > .btn-group{
    flex-wrap:wrap;
    justify-content:flex-start;
  }
  /* Унификация мобильной сетки: формы и карточки на всех страницах в 1 колонку */
  .row.cols-4,
  .row.cols-3,
  .row.cols-2{
    grid-template-columns:1fr !important;
  }
  .grid.cols-4,
  .grid.cols-3,
  .grid.cols-2{
    grid-template-columns:1fr;
  }
  /* Частый источник переполнений: inline min-width/max-width/width в старых шаблонах */
  .field[style*="min-width"]{
    min-width:0 !important;
  }
  .field[style*="max-width"]{
    max-width:100% !important;
  }
  :not(table):not(th):not(td)[style*="min-width"]{
    min-width:0 !important;
  }
  :not(table):not(th):not(td)[style*="max-width"]{
    max-width:100% !important;
  }
  [style*="grid-column: span 2"]{
    grid-column:auto !important;
  }
  input[style*="width:"],
  select[style*="width:"],
  textarea[style*="width:"]{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  input[style*="min-width"],
  select[style*="min-width"],
  textarea[style*="min-width"]{
    min-width:0 !important;
  }
  .card [style*="display:flex"][style*="align-items:end"]{
    align-items:stretch !important;
  }
  .card [style*="display:flex"][style*="justify-content:end"]{
    justify-content:flex-start !important;
  }
  .card [style*="display:flex"][style*="justify-content:space-between"]{
    justify-content:flex-start !important;
  }
  .table-wrap{
    margin-left:-2px;
    margin-right:-2px;
  }
  .table th,
  .table td{
    font-size:12px;
  }
  .table td .btn.small{
    white-space:nowrap;
  }
  .app:not(.app--guest-login) .topbar-right{
    justify-content:flex-end;
  }
  .sidebar-toggle-text{display:none}
  form[style*="max-width"]{
    max-width:100% !important;
  }
  .crm-modal{
    padding:12px;
    align-items:flex-end;
  }
  .crm-modal__actions{
    flex-direction:column-reverse;
    align-items:stretch;
  }
  .crm-modal__actions .btn{
    width:100%;
    justify-content:center;
  }
}
@media (max-width:480px){
  .editor-all-orders-quick .field{
    flex:1 1 100%;
    min-width:0;
  }
  .editor-all-orders-quick .order-deal-at-wrap{
    flex:1 1 100%;
    min-width:0;
  }
  .btn-group--form-footer{
    flex-direction:column;
    align-items:stretch;
  }
  .btn-group--form-footer .btn,
  .btn-group--form-footer a.btn{
    width:100%;
    min-width:0;
    justify-content:center;
  }
  /* B.16: плотные таблицы на ~390 — локальный scroll, без document overflow */
  .table-wrap{
    margin-left:0;
    margin-right:0;
    max-width:100%;
    touch-action:pan-x pan-y;
  }
  .table.compact{
    min-width:640px;
  }
  .orders-table{
    min-width:980px;
  }
  .table th,
  .table td{
    padding:7px 6px;
    font-size:12px;
  }
  .table-wrap--sticky{
    max-height:62vh;
  }
  /* Закреплённый ID при горизонтальном скролле заказов */
  .orders-table th:first-child,
  .orders-table td:first-child{
    position:sticky;
    left:0;
    z-index:2;
    background:var(--table-bg, var(--panel));
    box-shadow:2px 0 6px rgba(0,0,0,.18);
    min-width:3.25rem;
  }
  .orders-table thead th:first-child{
    z-index:3;
    background:var(--panel);
  }
  .dashboard-period-presets-scroll{
    touch-action:pan-x;
    -webkit-overflow-scrolling:touch;
  }
}
.order-deal-at-row{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  width:100%;
  box-sizing:border-box;
}
.order-deal-at-date{
  flex:0 0 auto;
  width:auto;
  min-width:9.5rem;
  max-width:12rem;
}
.order-deal-at-time-group{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:4px;
  flex:0 0 auto;
  min-width:0;
}
.order-deal-at-time{
  flex:0 0 auto;
  min-width:4.5rem;
  padding:8px 8px;
  text-align:center;
  box-sizing:border-box;
}
.order-deal-at-hm{
  min-width:4.5rem;
  max-width:5.25rem;
  width:4.75rem;
  flex:0 0 auto;
}
.order-deal-at-colon{
  opacity:.75;
  font-weight:700;
  padding:0 4px;
  flex-shrink:0;
}
/* Не растягивать блок на всю строку — иначе поле даты с flex-grow уводит время вправо */
.editor-all-orders-quick .order-deal-at-wrap{
  flex:0 1 min(100%, 420px);
  min-width:min(100%, 220px);
  max-width:100%;
}
.grid.cols-3.order-create-services-grid{
  grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
}
.order-create-services-card .card-b{
  min-width:0;
}
@media (max-width:1024px){
  .row.cols-2{grid-template-columns:1fr}
  .grid.cols-2{grid-template-columns:1fr}
  .main:not(.main--guest-login){
    padding:0;
  }
  .main:not(.main--guest-login) > .main-body{
    padding-left:14px;
    padding-right:14px;
    padding-bottom:14px;
    padding-top:var(--shell-topbar-offset, 56px);
  }
  .card .card-h > div:first-child{font-size:clamp(15px,4vw,18px)}
}
@media (max-width:640px){
  .main:not(.main--guest-login){
    padding:0;
  }
  .main:not(.main--guest-login) > .main-body{
    padding-left:12px;
    padding-right:12px;
    padding-bottom:12px;
    padding-top:var(--shell-topbar-offset, 56px);
  }
  .card .card-b,.card .card-h{padding-left:12px;padding-right:12px}
  .btn-group-period{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    gap:8px;
    padding-bottom:8px;
    margin:0 -4px;
    padding-left:4px;
    padding-right:4px;
    justify-content:flex-start;
  }
  .btn-group-period .btn-period{
    flex:0 0 auto;
    min-width:unset;
  }
  .dashboard-period-row{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .dashboard-period-presets-scroll{
    flex:1 1 100%;
    align-self:stretch;
    width:100%;
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    padding-bottom:6px;
    margin:0 -4px;
    padding-left:4px;
    padding-right:4px;
  }
  .dashboard-period-presets-scroll .btn-group-period{
    flex-wrap:nowrap;
    width:max-content;
    max-width:none;
    min-width:min(100%,max-content);
  }
  .dashboard-period-presets-scroll .btn-period{
    flex:0 0 auto;
    min-width:unset;
  }
  .dashboard-period-custom{
    width:100%;
    max-width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    align-items:stretch;
    padding-top:6px;
    border-top:1px solid var(--line);
    gap:6px 8px;
  }
  .dashboard-period-custom > .dashboard-period-date-mod{
    min-width:0;
    max-width:none;
    width:auto;
    min-height:32px;
    padding:0 6px;
    flex:unset;
  }
  .dashboard-period-custom input[type="date"]{
    min-width:0;
    width:100%;
    max-width:100%;
    font-size:11px;
    padding:6px 2px;
  }
  .dashboard-period-date-actions{
    grid-column:1 / -1;
    width:100%;
    max-width:100%;
  }
  .dashboard-period-date-actions .btn.primary{
    min-height:32px;
    width:100%;
    max-width:100%;
    font-size:11px;
    padding:8px 12px;
  }
  .kpi .value{font-size:clamp(18px,5vw,22px)}
}
@media (max-width:520px){
  .main:not(.main--guest-login) > .main-body{
    padding-left:12px;
    padding-right:12px;
    padding-bottom:max(12px, env(safe-area-inset-bottom));
    padding-top:var(--shell-topbar-offset, 56px);
  }
  .topbar{margin-bottom:0}
  .grid.cols-2.editor-rankings-grid{gap:14px}
  .notifications-dropdown{
    left:12px;
    right:12px;
    width:auto;
    min-width:0;
    max-width:none;
  }
  .chart-wrap,.chart-wrap--donut{height:min(280px,55vh)}
  .th-client,.td-client{min-width:0;max-width:none}
}

/* ——— Чаты (messenger inbox) ——— */
/* Страница Чаты: модуль в высоте окна, скролл только у ленты сообщений */
.main:not(.main--guest-login):has(#msg-inbox){
  display:flex;
  flex-direction:column;
  height:100dvh;
  max-height:100dvh;
  overflow:hidden;
  box-sizing:border-box;
  padding-bottom:0;
}
.main:not(.main--guest-login):has(#msg-inbox) > .topbar{
  flex:0 0 auto;
}
.main:not(.main--guest-login):has(#msg-inbox) > .main-body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  padding-bottom:0;
}
.main:not(.main--guest-login):has(#msg-inbox) .crm-section-tabs{
  flex:0 0 auto;
}
.msg-inbox{
  display:grid;
  grid-template-columns:minmax(300px,380px) minmax(0,1fr);
  grid-template-rows:auto minmax(0,1fr);
  gap:12px;
  align-items:stretch;
  flex:1 1 auto;
  min-height:0;
  height:auto;
  max-height:none;
  margin-top:0;
  width:100%;
  overflow:hidden;
}
.msg-channel-bar{
  grid-column:1 / -1;
  margin:0;
  padding:10px 12px 14px;
  position:relative;
  /* Выше .msg-chat-head (z:40): иначе dropdown уведомлений уходит под шапку чата */
  z-index:55;
  overflow:visible;
}
.msg-channel-bar-inner{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:10px;
  min-width:0;
  width:100%;
}
.msg-channel-logos{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  min-width:0;
  flex:1 1 auto;
  padding:2px 0 4px;
}
.msg-channel-toolbar{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
  margin-left:auto;
}
.msg-tools-slot{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.msg-tools-panel{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:6px;
}
.msg-tools-gear{
  display:none;
  width:40px;
  height:40px;
  min-width:40px;
  padding:0;
  border-radius:12px;
  align-items:center;
  justify-content:center;
}
.msg-tools-gear::before{
  content:"\2699";
  font-size:18px;
  line-height:1;
}
.msg-tools-portal{
  /* host for mobile popover; emptied on desktop after JS moves panel into slot */
  position:absolute;
  width:0;
  height:0;
  overflow:visible;
  pointer-events:none;
}
body.body--msg-tools-bar .msg-tools-gear--top{
  display:none;
  margin-left:auto;
  flex-shrink:0;
}
body.body--msg-tools-bar .topbar-right--msg{
  display:none;
}
@media (min-width:721px){
  body.body--msg-tools-bar .msg-tools-gear--top{display:none !important}
  body.body--msg-tools-bar .topbar-right--msg{display:none !important}
  body.body--msg-tools-bar .msg-tools-portal{display:none}
  .msg-tools-slot .msg-tools-panel{pointer-events:auto}
}
@media (min-width:1025px){
  body.body--msg-tools-bar .app:not(.app--guest-login) .topbar{display:none !important}
  body.body--msg-tools-bar .main:not(.main--guest-login):has(#msg-inbox){
    padding-top:18px;
  }
}
.msg-channel-logo{
  display:inline-flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:0;
  min-width:0;
  padding:6px;
  border-radius:12px;
  border:1px solid var(--line);
  background:var(--surface-inset);
  text-decoration:none;
  color:var(--text);
  transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease, filter .12s ease;
  position:relative;
}
.msg-channel-health{
  position:absolute;
  top:2px;
  right:2px;
  width:9px;
  height:9px;
  border-radius:50%;
  pointer-events:none;
  z-index:2;
  box-shadow:0 0 0 1.5px var(--surface-inset,#303238);
}
.msg-channel-health.is-ok{
  background:#22c55e;
}
.msg-channel-health.is-bad{
  background:#ef4444;
}
.msg-channel-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  min-width:28px;
  padding:0;
  position:relative;
  border-radius:8px;
  overflow:hidden;
  line-height:0;
  background:transparent;
}
.msg-channel-badge-mark{
  position:absolute;
  right:-5px;
  bottom:-4px;
  min-width:14px;
  height:14px;
  padding:0 3px;
  border-radius:999px;
  background:var(--brand,#10b981);
  color:#fff;
  font-size:9px;
  font-weight:800;
  line-height:14px;
  text-align:center;
  box-shadow:0 0 0 1px var(--surface-inset,#303238);
  pointer-events:none;
}
.msg-channel-badge svg{
  display:block;
  width:28px;
  height:28px;
}
.msg-channel-badge svg image{
  width:100%;
  height:100%;
}
.msg-channel-badge-mark{display:none}
.msg-channel-badge--all,
.msg-channel-badge--settings{
  background:var(--surface-nested);
  color:var(--text);
  border:1px solid var(--line);
}
.msg-channel-badge--all .msg-channel-badge-mark{
  display:inline;
  font-size:10px;
  font-weight:800;
  font-family:Segoe UI,Arial,sans-serif;
  line-height:1;
  color:var(--text);
}
.msg-channel-badge--settings{
  position:relative;
}
.msg-channel-badge--settings::before{
  content:"\2699";
  font-size:16px;
  line-height:1;
  speak:never;
  color:var(--text);
}
.msg-channel-settings.is-active,
.msg-channel-logo.msg-channel-settings:hover{
  border-color:var(--brand,#10b981);
}
.msg-channel-caption{display:none !important}
.msg-channel-logo svg{display:block}
.msg-channel-logo:hover{transform:translateY(-1px);border-color:var(--brand,#10b981)}
.msg-channel-logo.is-active{
  border-color:var(--brand,#10b981);
  box-shadow:0 0 0 2px rgba(16,185,129,.25);
  background:var(--surface-nested);
}
.msg-channel-logo.is-live .msg-channel-badge{filter:none;opacity:1}
.msg-channel-logo.is-off .msg-channel-badge{
  filter:grayscale(1) contrast(.95);
  opacity:.5;
}
.msg-channel-logo-all{display:flex;color:var(--text)}
.msg-col.card{display:flex;flex-direction:column;min-height:0;margin:0}
/* Нельзя давать flex:1 всем .card-b — иначе блок поиска раздувает пустоту над списком диалогов */
.msg-col > .card-h,
.msg-col > .card-b:not(.msg-conv-scroll){flex:0 0 auto}
.msg-list > .msg-conv-scroll,
.msg-list > [data-scrollbar="cropped"]:has(.msg-conv-scroll),
.msg-chat > .card-b{flex:1 1 0%;min-height:0;overflow:auto}
.msg-list > [data-scrollbar="cropped"]:has(.msg-conv-scroll){overflow:hidden}
.msg-chat > .msg-chat-main{
  flex:1 1 0%;
  min-height:0;
  overflow:hidden;
}
.msg-list{grid-column:1;grid-row:2;min-height:0}
.msg-chat{grid-column:2;grid-row:2;min-height:0}
.msg-channels{display:none !important}
.msg-list-tools{padding-top:8px;padding-bottom:8px}
.msg-list-tools .msg-search{margin-bottom:0}
.msg-list-heading{
  display:none;padding:10px 12px 4px;flex:0 0 auto;
  align-items:center;justify-content:space-between;gap:10px;
}
.msg-list-heading h3{
  margin:0;font-size:1.05rem;font-weight:700;
  display:inline-flex;align-items:center;gap:8px;min-width:0;
}
.msg-close-dialog{
  flex:0 0 auto;margin-left:auto;white-space:nowrap;
  font-size:12px;padding:5px 10px;line-height:1.2;
}
.msg-close-dialog[hidden]{display:none !important}
.msg-unread-bar{
  display:flex;align-items:center;gap:8px;
  flex:0 0 auto;
  padding:2px 12px 6px;
  border:0;
  background:transparent;
  min-width:0;
}
.msg-unread-switch{
  display:flex;align-items:center;gap:8px;flex:1 1 auto;min-width:0;
  text-decoration:none;color:var(--muted);min-height:28px;
}
.msg-unread-switch__icon{
  width:16px;height:16px;flex:0 0 auto;display:block;opacity:.8;color:var(--muted);
}
.msg-unread-switch__text{
  flex:1 1 auto;font-size:13px;font-weight:400;line-height:1.2;min-width:0;color:var(--text);
  letter-spacing:0;
}
.msg-unread-switch__track{
  width:34px;height:20px;border-radius:999px;flex:0 0 auto;
  background:rgba(148,163,184,.32);position:relative;
  transition:background .18s ease;
}
.msg-unread-switch__knob{
  position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;
  background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.28);
  transition:transform .18s ease;
}
.msg-unread-switch.is-on .msg-unread-switch__track{background:var(--brand,#10b981)}
.msg-unread-switch.is-on .msg-unread-switch__knob{transform:translateX(14px)}
.msg-unread-switch.is-on{color:var(--text)}
.msg-unread-switch.is-on .msg-unread-switch__icon{opacity:1;color:var(--text)}
.msg-deal-filter{position:relative;flex:0 0 auto}
.msg-deal-filter-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:10px;border:1px solid var(--line);
  background:var(--surface-inset);color:var(--text);cursor:pointer;padding:0;
}
.msg-deal-filter-btn:hover,.msg-deal-filter.is-open .msg-deal-filter-btn,.msg-deal-filter.is-active .msg-deal-filter-btn{
  border-color:color-mix(in srgb, var(--brand) 45%, var(--line));
  background:var(--surface-brand-soft,var(--surface-nested));
}
.msg-deal-filter-btn__icon{
  width:16px;height:16px;display:block;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 5.5h18l-7 8.2V19l-4 2v-7.3L3 5.5z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 5.5h18l-7 8.2V19l-4 2v-7.3L3 5.5z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.msg-deal-filter-menu{
  position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:168px;
  padding:6px;border-radius:12px;border:1px solid var(--line);
  background:var(--panel);box-shadow:var(--shadow);
  display:none;flex-direction:column;gap:2px;
}
.msg-deal-filter.is-open .msg-deal-filter-menu{display:flex}
.msg-deal-filter-menu[hidden]{display:none !important}
.msg-deal-filter-option{
  display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;color:var(--text);text-decoration:none;
  font-size:13px;font-weight:500;
}
.msg-deal-filter-option::before{
  content:"";width:8px;height:8px;border-radius:50%;flex:0 0 auto;
  background:var(--muted);opacity:.55;
}
.msg-deal-filter-option:hover{background:var(--surface-inset)}
.msg-deal-filter-option.is-on{font-weight:700}
.msg-deal-filter-option[data-deal="new"]::before{background:var(--deal-new);opacity:1}
.msg-deal-filter-option[data-deal="in_work"]::before{background:var(--deal-in-work);opacity:1}
.msg-deal-filter-option[data-deal="rejected"]::before{background:var(--deal-rejected);opacity:1}
.msg-deal-filter-option[data-deal="thinking"]::before{background:var(--deal-thinking);opacity:1}
.msg-deal-filter-option[data-deal="completed"]::before{background:var(--deal-completed);opacity:1}
.msg-deal-filter-option[data-deal="new"].is-on{background:var(--deal-new-bg);color:var(--deal-new)}
.msg-deal-filter-option[data-deal="in_work"].is-on{background:var(--deal-in-work-bg);color:var(--deal-in-work)}
.msg-deal-filter-option[data-deal="rejected"].is-on{background:var(--deal-rejected-bg);color:var(--deal-rejected)}
.msg-deal-filter-option[data-deal="thinking"].is-on{background:var(--deal-thinking-bg);color:var(--deal-thinking)}
.msg-deal-filter-option[data-deal="completed"].is-on{background:var(--deal-completed-bg);color:var(--deal-completed)}
.msg-deal-select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  width:auto;max-width:160px;min-width:7.5rem;
  font-size:12.5px;font-weight:700;line-height:1.2;letter-spacing:-.01em;
  padding:6px 28px 6px 12px;border-radius:999px;border:1px solid var(--line);
  background-color:var(--surface-inset);color:var(--text);flex:0 0 auto;
  cursor:pointer;
  /* Одна стрелка: longhand + !important против .card select{background:…} (иначе tile) */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2394a3b8' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 10px center !important;
  background-size:12px 12px !important;
  transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease;
}
.msg-deal-select::-ms-expand{display:none}
.msg-deal-select:hover{filter:brightness(1.05)}
.msg-deal-select:focus-visible{
  outline:none;box-shadow:0 0 0 3px var(--ring-brand);
}
.msg-deal-select[data-status="new"]{
  color:var(--deal-new);background-color:var(--deal-new-bg);border-color:var(--deal-new-border);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2360a5fa' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
.msg-deal-select[data-status="in_work"]{
  color:var(--deal-in-work);background-color:var(--deal-in-work-bg);border-color:var(--deal-in-work-border);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2334d399' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
.msg-deal-select[data-status="rejected"]{
  color:var(--deal-rejected);background-color:var(--deal-rejected-bg);border-color:var(--deal-rejected-border);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23f87171' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
.msg-deal-select[data-status="thinking"]{
  color:var(--deal-thinking);background-color:var(--deal-thinking-bg);border-color:var(--deal-thinking-border);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23fbbf24' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
.msg-deal-select[data-status="completed"]{
  color:var(--deal-completed);background-color:var(--deal-completed-bg);border-color:var(--deal-completed-border);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23c084fc' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
html[data-theme="light"] .msg-deal-select[data-status="new"]{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231d4ed8' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
html[data-theme="light"] .msg-deal-select[data-status="in_work"]{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23047857' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
html[data-theme="light"] .msg-deal-select[data-status="rejected"]{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23b91c1c' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
html[data-theme="light"] .msg-deal-select[data-status="thinking"]{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23b45309' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
html[data-theme="light"] .msg-deal-select[data-status="completed"]{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%237e22ce' d='M2.2 4.2L6 8l3.8-3.8-.9-.9L6 6.2 3.1 3.3z'/%3E%3C/svg%3E");
}
.msg-complete-order-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.msg-complete-order-opt{
  display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:12px;
  border:1px solid var(--line);background:var(--surface-inset);cursor:pointer;
}
.msg-complete-order-opt:hover{background:var(--surface-nested)}
.msg-complete-order-opt input{margin-top:3px;flex:0 0 auto}
.msg-complete-order-opt__body{min-width:0;flex:1 1 auto}
.msg-complete-order-opt__title{font-weight:700;font-size:14px}
.msg-complete-order-opt__meta{font-size:12px;color:var(--muted);margin-top:2px}
.visually-hidden{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;
  margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}
.topbar-center-title{
  flex:1 1 auto;min-width:0;text-align:center;
  font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--text);
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  pointer-events:none;
}
.topbar-center-unread{pointer-events:none;vertical-align:middle}
@media (min-width:1025px){
  .msg-list-heading{display:flex}
  body.body--msg-tools-bar .topbar-center-title{display:none}
}

.msg-channel-list{display:flex;flex-direction:column;gap:4px;padding-top:4px}
.msg-channel-item{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:8px 10px;border-radius:8px;color:var(--text);text-decoration:none;
  border:1px solid transparent;
}
.msg-channel-item:hover{background:var(--surface-inset)}
.msg-channel-item.is-active{background:var(--surface-nested);border-color:var(--line)}
.msg-channel-dot{display:none !important}
.msg-conv-item{
  display:flex;align-items:flex-start;gap:10px;
  /* слева запас под выступ значка канала (~½ от 28px) */
  padding:12px 12px 16px 18px;border-radius:16px;text-decoration:none;color:var(--text);
  border:1px solid transparent;margin-bottom:2px;
  transition:background .15s ease;min-width:0;
  overflow:visible;
}
.msg-conv-item:hover{background:var(--surface-inset)}
.msg-conv-item.is-active{background:var(--surface-brand-soft);border-color:transparent}
.msg-conv-media{
  position:relative;flex:0 0 auto;width:56px;height:56px;
  overflow:visible;
}
.msg-conv-avatar{
  width:56px;height:56px;border-radius:16px;overflow:hidden;
  background:var(--surface-nested,#f2f1f0);
  display:flex;align-items:center;justify-content:center;
}
.msg-conv-avatar img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.msg-conv-avatar-initials{
  font-size:16px;font-weight:700;letter-spacing:.02em;color:var(--muted);
  line-height:1;user-select:none;
}
/* Значок: левый нижний угол аватара, выступ ~½ влево и ~½ вниз */
.msg-conv-channel-badge{
  position:absolute;left:-14px;right:auto;bottom:-14px;
  width:28px;height:28px;border-radius:9px;
  display:inline-flex;align-items:center;justify-content:center;
  background:transparent;
  box-shadow:none;
  line-height:0;overflow:hidden;
}
.msg-conv-channel-badge svg{width:26px;height:26px;display:block}
.msg-conv-info{
  flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;
  padding-top:1px;
}
.msg-conv-top{
  display:flex;justify-content:space-between;gap:8px;align-items:baseline;
}
.msg-conv-name{
  margin:0;font-size:15px;font-weight:700;letter-spacing:-.01em;line-height:1.25;
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.msg-conv-time{
  flex:0 0 auto;font-size:12px;line-height:1.2;color:var(--muted);font-weight:500;
  white-space:nowrap;
}
.msg-conv-preview{
  display:flex;align-items:center;gap:6px;min-width:0;
  color:var(--muted);font-size:13.5px;line-height:1.3;
}
.msg-conv-preview-text{
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.msg-conv-unread{
  flex:0 0 auto;min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background:#ff4053;color:#fff;font-size:11px;font-weight:700;line-height:1;
}
.msg-conv-unread[hidden]{display:none!important}
.msg-conv-order{margin-top:2px;display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.msg-conv-order-chip{
  display:inline-flex;align-items:center;gap:4px;
  max-width:100%;
}
.msg-conv-order-num{
  display:inline-flex;align-items:center;
  font-size:12px;font-weight:700;line-height:1.2;
  color:var(--brand,#10b981);
  padding:2px 7px;border-radius:8px;
  background:color-mix(in srgb, var(--brand,#10b981) 14%, transparent);
  border:1px solid color-mix(in srgb, var(--brand,#10b981) 28%, transparent);
}
.msg-conv-order-st{
  font-size:11px;font-weight:600;line-height:1.2;color:var(--muted);
  white-space:nowrap;
}
.msg-conv-order-ed{
  font-size:11px;font-weight:700;line-height:1.2;color:var(--text);
  white-space:nowrap;opacity:.85;
}
.msg-conv-order-ed::before{content:"·";margin:0 2px 0 0;color:var(--muted);font-weight:600}
.msg-conv-order-more{font-size:11px;color:var(--muted);font-weight:600}
.msg-conv-channel{display:none}
.msg-chat{padding:0;overflow:hidden;display:flex;flex-direction:column;border:0;background:transparent;box-shadow:none;min-height:0;height:100%;max-height:100%}
.msg-chat.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.msg-chat-main{display:flex;flex-direction:column;min-height:0;min-width:0;flex:1 1 0%;overflow:hidden;height:100%;position:relative}
.msg-chat-main.is-file-drag::after{
  content:"Перетащите файлы сюда";
  position:absolute;inset:8px;z-index:40;pointer-events:none;
  display:flex;align-items:center;justify-content:center;
  border:2px dashed rgba(82,158,244,.65);border-radius:14px;
  background:rgba(82,158,244,.1);
  font-size:15px;font-weight:700;line-height:1.25;color:#529ef4;
  text-align:center;padding:16px;box-sizing:border-box;
}
html[data-theme="light"] .msg-chat-main.is-file-drag::after{
  background:rgba(82,158,244,.12);color:#2563eb;border-color:rgba(37,99,235,.55);
}
.msg-composer.is-drag-over .msg-composer-bar{
  outline:2px dashed rgba(82,158,244,.75);outline-offset:2px;
}
.msg-history-stack{
  position:relative;
  flex:1 1 0%;
  min-height:0;
  min-width:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.msg-history-stack > [data-scrollbar="cropped"],
.msg-history-stack > .msg-thread{
  flex:1 1 0%;
  min-height:0;
  overflow:hidden;
}
.msg-history-stack > .msg-thread[data-scrollbar="scrollable"]{
  overflow-x:hidden;
  overflow-y:auto;
}
/* VK HopNavigationButton — к последним / непрочитанным ниже */
.msg-hop-btn{
  position:absolute;
  right:14px;
  bottom:12px;
  z-index:16;
  width:40px;
  height:40px;
  margin:0;
  padding:0;
  border:0;
  border-radius:50%;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--text);
  background:var(--panel);
  box-shadow:0 2px 8px rgba(0,0,0,.18), 0 0 0 1px var(--line);
  opacity:0;
  transform:translateY(8px) scale(.92);
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease, background .15s ease, box-shadow .15s ease;
}
.msg-hop-btn[hidden]{display:none !important}
.msg-hop-btn.is-visible:not([hidden]){
  display:inline-flex;
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.msg-hop-btn:hover{
  background:var(--surface-nested);
  box-shadow:0 4px 14px rgba(0,0,0,.22), 0 0 0 1px var(--line);
}
.msg-hop-btn:active{transform:scale(.96)}
.msg-hop-btn__icon{
  width:20px;
  height:20px;
  display:block;
  position:relative;
}
.msg-hop-btn__icon::before{
  content:"";
  position:absolute;
  left:50%;
  top:42%;
  width:10px;
  height:10px;
  margin-left:-5px;
  margin-top:-6px;
  border-right:2.5px solid currentColor;
  border-bottom:2.5px solid currentColor;
  transform:rotate(45deg);
  box-sizing:border-box;
}
.msg-hop-btn__badge{
  position:absolute;
  top:-4px;
  right:-4px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:#2688EB;
  color:#fff;
  font-size:11px;
  font-weight:700;
  line-height:18px;
  text-align:center;
  box-shadow:0 0 0 2px var(--panel);
}
.msg-hop-btn__badge[hidden]{display:none !important}
html[data-theme="light"] .msg-hop-btn{
  background:#fff;
  color:#2c2d2e;
  box-shadow:0 2px 10px rgba(0,0,0,.12), 0 0 0 1px rgba(0,0,0,.06);
}
html[data-theme="light"] .msg-hop-btn:hover{background:#f5f5f7}
html[data-theme="light"] .msg-hop-btn__badge{box-shadow:0 0 0 2px #fff}
.msg-chat-head{
  flex:0 0 auto;padding:12px 14px 10px;border-bottom:1px solid var(--line);
  background:color-mix(in srgb, var(--panel) 88%, transparent);
  backdrop-filter:blur(8px);
  /* Выше ленты сообщений — иначе «Управление заказом» уходит под пузыри */
  position:relative;
  z-index:40;
  overflow:visible;
}
.msg-chat-head-main{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  flex-wrap:wrap;min-width:0;
  container-type:inline-size;container-name:msg-chat-head;
}
.msg-back-list{display:none;flex:0 0 auto;white-space:nowrap}
.msg-chat-peer{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;gap:2px;align-items:stretch}
.msg-chat-peer-row{
  display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;min-width:0;margin-bottom:0;
}
/* ПК / планшет: статус и «Управление заказом» в одну строку — кнопка справа от статуса */
.msg-chat-peer-tools{
  display:flex;flex-direction:row;align-items:center;gap:6px;flex-wrap:nowrap;
  flex:0 0 auto;min-width:0;max-width:100%;margin-left:auto;
}
.msg-chat-peer-tools .msg-deal-select{width:auto;max-width:152px;flex:0 0 auto;min-width:7.2rem}
.msg-chat-peer-actions{
  display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;min-width:0;
}
.msg-order-manage-dd{position:relative;display:block;width:auto;max-width:none;flex:0 0 auto;z-index:1}
/* Одна высота/шрифт с .msg-deal-select (29px / 12.5px) */
.msg-chat-peer-tools .msg-deal-select,
.msg-order-manage-toggle.btn,
.msg-order-manage-toggle,
.msg-mark-unread-btn{
  box-sizing:border-box;
  height:29px;
  min-height:29px;
  max-height:29px;
  font-size:12.5px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.01em;
}
.msg-order-manage-toggle.btn,
.msg-order-manage-toggle{
  width:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 12px;
  border-radius:999px;
  gap:4px;
  white-space:nowrap;
  border:1px solid var(--line);
  background:var(--card-bg);
  color:var(--text);
}
.msg-order-manage-toggle.btn:hover,
.msg-order-manage-toggle:hover{
  background:var(--surface-nested);
  border-color:var(--panel2);
  color:var(--text);
}
.msg-mark-unread-btn{
  width:29px;
  min-width:29px;
  padding:0;
  margin:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--surface-inset);
  color:var(--muted);
  cursor:pointer;
  flex:0 0 auto;
  line-height:0;
  transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.msg-mark-unread-btn:hover{
  color:var(--text);background:var(--surface-nested);border-color:var(--line);
}
.msg-mark-unread-btn:focus-visible{
  outline:none;box-shadow:0 0 0 3px var(--ring-brand);
}
.msg-mark-unread-btn:disabled{opacity:.55;cursor:wait}
.msg-mark-unread-icon{display:block;width:17px;height:17px}
.msg-order-manage-panel{
  position:absolute;right:0;top:calc(100% + 4px);z-index:60;
  min-width:100%;width:max-content;max-width:min(240px,85vw);
  display:flex;flex-direction:column;padding:4px;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);
}
.msg-order-manage-panel[hidden]{display:none !important}
.msg-order-manage-item{
  display:block;width:100%;text-align:left;border:0;background:transparent;
  color:var(--text);padding:8px 10px;border-radius:8px;cursor:pointer;
  font:inherit;font-size:13px;font-weight:600;line-height:1.25;
}
.msg-order-manage-item:hover,
.msg-order-manage-item:focus-visible{
  background:rgba(148,163,184,.12);outline:none;
}
.msg-order-manage-item--danger{color:#f87171}
.msg-order-manage-item--danger:hover{background:rgba(248,113,113,.12)}
html[data-theme="light"] .msg-order-manage-item--danger{color:#dc2626}
html[data-theme="light"] .msg-order-manage-item--danger:hover{background:rgba(220,38,38,.08)}
.msg-peer-presence{
  display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;min-width:0;
  font-size:12px;line-height:1.2;color:var(--muted);font-weight:600;
  margin:0;align-self:center;
}
.msg-peer-presence-dot{
  width:9px;height:9px;border-radius:50%;flex:0 0 auto;
  background:var(--muted);box-shadow:0 0 0 2px color-mix(in srgb, var(--panel) 70%, transparent);
}
.msg-peer-presence--online .msg-peer-presence-dot{
  background:#22c55e;box-shadow:0 0 0 2px color-mix(in srgb, #22c55e 25%, transparent);
}
.msg-peer-presence--offline .msg-peer-presence-dot{background:#94a3b8}
.msg-peer-presence--unknown .msg-peer-presence-dot{opacity:.45}
.msg-peer-presence-label{
  max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;
}
.msg-peer-presence--online .msg-peer-presence-label{color:#22c55e}
.msg-chat-peer h3{
  margin:0;font-size:1.08rem;font-weight:700;letter-spacing:-.02em;
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto;
}
.msg-chat-peer-identity{
  display:flex;align-items:center;gap:6px 8px;min-width:0;flex:0 1 auto;flex-wrap:wrap;
}
.msg-chat-peer-identity h3{flex:0 1 auto;max-width:100%}
.msg-peer-phone{
  flex:0 0 auto;font-size:13px;font-weight:500;color:var(--muted);line-height:1.2;
  text-decoration:none;white-space:nowrap;
}
a.msg-peer-phone:hover,
a.msg-peer-phone:focus-visible{
  color:var(--brand, #5c7cfa);
  text-decoration:underline;
  outline:none;
}
.msg-peer-name-link{
  color:inherit;text-decoration:none;
  display:inline;min-width:0;
}
.msg-peer-name-link:hover,
.msg-peer-name-link:focus-visible{
  color:var(--brand, #5c7cfa);
  text-decoration:underline;
  outline:none;
}
.msg-chat-peer-sub{
  color:var(--muted);font-size:12.5px;
  display:flex;align-items:center;gap:10px;flex-wrap:nowrap;min-width:0;
  overflow:visible;
}
.msg-chat-peer-item{
  color:var(--muted);font-size:12.5px;line-height:1.35;
  display:flex;align-items:baseline;gap:6px;flex-wrap:nowrap;min-width:0;max-width:100%;
}
.msg-chat-peer-item-label{flex:0 0 auto;opacity:.9}
.msg-chat-peer-item-link,
.msg-chat-peer-item-title{
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-weight:600;color:var(--text);
}
.msg-chat-peer-item-link:hover{text-decoration:underline}
.msg-chat-peer-item-price{flex:0 0 auto;white-space:nowrap;opacity:.9}
.msg-chat-peer-meta{
  min-width:0;overflow:visible;white-space:nowrap;
  display:inline-flex;align-items:center;gap:6px;max-width:100%;
  position:relative;z-index:5;
}
.msg-team-members-dd{position:relative;display:inline-flex;align-items:center;min-width:0;max-width:100%}
button.msg-team-members-toggle{
  appearance:none;-webkit-appearance:none;border:0;background:transparent;padding:0;margin:0;
  font:inherit;cursor:pointer;text-align:left;
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--text);font-weight:600;
  border-bottom:1px dashed color-mix(in srgb, var(--muted) 55%, transparent);
}
button.msg-team-members-toggle:hover{
  color:var(--brand,#10b981);border-bottom-color:var(--brand,#10b981);
}
button.msg-team-members-toggle:focus-visible{
  outline:none;border-radius:4px;box-shadow:0 0 0 3px var(--ring-brand);
}
button.msg-team-members-toggle[aria-expanded="true"]{
  color:var(--brand,#10b981);border-bottom-style:solid;
}
.msg-team-members-panel{
  position:absolute;left:0;top:calc(100% + 6px);z-index:80;
  width:min(280px,78vw);max-height:min(360px,55vh);
  display:flex;flex-direction:column;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow,0 10px 28px rgba(0,0,0,.22));
  overflow:hidden;
}
.msg-team-members-panel[hidden]{display:none !important}
.msg-team-members-panel__head{
  flex:0 0 auto;padding:10px 12px 8px;font-size:12px;font-weight:700;
  color:var(--muted);border-bottom:1px solid var(--line);letter-spacing:.02em;
}
.msg-team-members-panel__list{
  flex:1 1 auto;min-height:0;overflow:auto;padding:6px;
  -webkit-overflow-scrolling:touch;
}
.msg-team-members-empty{
  padding:14px 10px;font-size:13px;color:var(--muted);text-align:center;
}
.msg-team-member{
  display:flex;align-items:center;gap:10px;padding:8px 8px;border-radius:10px;
}
.msg-team-member:hover{background:rgba(148,163,184,.08)}
.msg-team-member__avatar{
  position:relative;flex:0 0 auto;width:32px;height:32px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(148,163,184,.18);color:var(--text);
  font-size:12px;font-weight:700;line-height:1;user-select:none;
}
.msg-team-member__avatar .msg-avatar-online{
  position:absolute;right:-1px;bottom:-1px;width:9px;height:9px;border-radius:50%;
  background:#94a3b8;border:2px solid var(--panel);box-sizing:border-box;
}
.msg-team-member__avatar .msg-avatar-online.is-online{background:#22c55e}
.msg-team-member__body{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;gap:1px}
.msg-team-member__name{
  font-size:13px;font-weight:600;line-height:1.25;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.msg-team-member__seen{
  font-size:11px;line-height:1.25;color:var(--muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.msg-team-member.is-online .msg-team-member__seen{color:#22c55e}
.msg-peer-channel-icon{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  text-decoration:none;border-radius:6px;line-height:0;
}
a.msg-peer-channel-icon:hover{filter:brightness(1.08)}
a.msg-peer-channel-icon:focus-visible{outline:none;box-shadow:0 0 0 3px var(--ring-brand)}
.msg-peer-channel-icon svg{width:14px;height:14px;display:block}
.msg-peer-channel-label{
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--muted);text-decoration:none;
}
a.msg-peer-channel-label{
  color:var(--text);font-weight:600;cursor:pointer;
  border-bottom:1px dashed color-mix(in srgb, var(--muted) 55%, transparent);
}
a.msg-peer-channel-label:hover{
  color:var(--brand,#10b981);border-bottom-color:var(--brand,#10b981);
}
a.msg-peer-channel-label:focus-visible{
  outline:none;border-radius:4px;box-shadow:0 0 0 3px var(--ring-brand);
}
.msg-peer-meta-sep{color:var(--muted);flex:0 0 auto;opacity:.75}
@container msg-chat-head (max-width: 640px){
  .msg-order-manage-toggle.btn,
  .msg-order-manage-toggle{
    font-size:12.5px;
    padding:0 10px;
    height:29px;
    min-height:29px;
  }
  .msg-chat-peer-tools .msg-deal-select{max-width:120px}
}
.msg-btn-short{display:none}
.msg-btn-full{display:inline}
.msg-order-inline{
  font-weight:700;color:var(--brand);text-decoration:none;white-space:nowrap;
  background:none;border:0;padding:0;cursor:pointer;font:inherit;
}
.msg-order-inline:hover{text-decoration:underline}
.msg-orders-dd{position:relative;display:inline-flex;align-items:center;vertical-align:middle;z-index:6}
.msg-orders-dd-toggle{line-height:inherit}
.msg-orders-dd-panel{
  position:absolute;left:0;top:calc(100% + 6px);z-index:80;
  min-width:320px;max-width:min(440px,92vw);max-height:min(70vh,560px);
  display:flex;flex-direction:column;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);overflow:auto;
}
.msg-orders-dd-panel[hidden]{display:none !important}
.msg-orders-dd-h{
  padding:10px 12px;font-weight:700;font-size:12px;color:var(--muted);
  border-bottom:1px solid var(--line);flex:0 0 auto;
}
.msg-orders-dd-list{
  list-style:none;margin:0;padding:6px;overflow:auto;min-height:0;
}
.msg-orders-dd-row{margin:0 0 4px}
.msg-orders-dd-item{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 10px;border-radius:10px;color:var(--text);text-decoration:none;
  font-size:13px;font-weight:600;width:100%;background:none;border:0;cursor:pointer;font:inherit;text-align:left;
}
.msg-orders-dd-item:hover{background:rgba(148,163,184,.1)}
.msg-orders-dd-num{color:var(--brand);font-weight:800;white-space:nowrap}
.msg-orders-dd-st{color:var(--muted);font-weight:500;font-size:12px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;
}
.msg-orders-dd-amt{font-weight:700;font-size:12px;white-space:nowrap}
.msg-orders-dd-detail{
  margin:0 6px 8px;padding:10px;border-radius:10px;background:rgba(15,23,42,.04);
  border:1px solid var(--line);
}
.msg-orders-dd-detail[hidden]{display:none !important}
.msg-orders-dd-detail-pre{
  margin:0 0 10px;white-space:pre-wrap;word-break:break-word;
  font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--text);
  max-height:160px;overflow:auto;
}
.msg-orders-dd-form{display:grid;gap:6px}
.msg-orders-dd-form label{display:grid;gap:2px;font-size:11px;color:var(--muted);font-weight:600}
.msg-orders-dd-form input,.msg-orders-dd-form textarea{
  width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:8px;
  padding:6px 8px;font:13px/1.3 inherit;background:var(--panel);color:var(--text);
}
.msg-orders-dd-form-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.msg-orders-dd-form-hint{margin:4px 0 0;font-size:11px;color:var(--muted);line-height:1.35}

/* Модалка параметров заказа (чат) */
html.msg-order-modal-open{overflow:hidden}
.msg-order-modal{
  position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;
  padding:16px;box-sizing:border-box;
}
.msg-order-modal[hidden]{display:none !important}
.msg-order-modal__backdrop{
  position:absolute;inset:0;background:rgba(15,23,42,.55);border:0;padding:0;cursor:pointer;
}
.msg-order-modal__dialog{
  position:relative;z-index:1;width:min(720px,96vw);max-height:min(90vh,860px);
  display:flex;flex-direction:column;overflow:hidden;margin:0;
  background:var(--panel);color:var(--text);border:1px solid var(--line);
}
.msg-order-modal__head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 14px;border-bottom:1px solid var(--line);flex:0 0 auto;
}
.msg-order-modal__title{margin:0;font-size:16px;font-weight:800}
.msg-order-modal__close{font-size:18px;line-height:1;min-width:32px}
.msg-order-modal__body{overflow:auto;padding:12px 14px 16px;min-height:0}
.msg-order-modal__preview{
  margin:0 0 12px;padding:10px 12px;border-radius:10px;
  background:var(--surface-inset, rgba(148,163,184,.08));
  border:1px solid var(--line);
  white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;
  font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--text);
  max-height:180px;overflow:auto;
}
.msg-order-modal__form{display:flex;flex-direction:column;gap:12px}
.msg-order-modal__grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;
}
.msg-order-modal__grid--tight{grid-template-columns:repeat(2,minmax(0,1fr))}
.msg-order-modal__form label{
  display:flex;flex-direction:column;align-items:flex-start;gap:4px;
  font-size:11px;font-weight:600;color:var(--muted);min-width:0;
}
.msg-order-modal__form label.msg-om-span2{grid-column:1 / -1}
.msg-order-modal__form input[type="text"],
.msg-order-modal__form input:not([type]),
.msg-order-modal__form input[type="number"],
.msg-order-modal__form textarea{
  box-sizing:border-box;max-width:100%;
  border:1px solid var(--line);border-radius:8px;
  padding:6px 8px;font:13px/1.35 inherit;background:var(--surface-nested, var(--panel));color:var(--text);
  white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;
}
.msg-order-modal__form input[type="number"]{width:7.5rem;white-space:nowrap}
.msg-order-modal__form textarea{min-height:36px;resize:vertical;width:min(100%,28rem)}
.msg-order-modal__form input.msg-om-grow{width:auto;min-width:7rem;max-width:100%}
.msg-order-modal__section{
  padding:10px;border-radius:10px;border:1px solid var(--line);
  background:var(--surface-inset, rgba(148,163,184,.06));
}
.msg-order-modal__section-h{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:12px;font-weight:700;color:var(--text);margin:0 0 8px;
}
.msg-om-extras{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.msg-om-extra{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px;
}
.msg-om-extra-on{flex-direction:row !important;align-items:center !important;gap:4px !important;font-size:11px}
.msg-om-extra input[data-ex-title]{flex:1 1 160px;min-width:120px}
.msg-om-extra input[data-ex-price],
.msg-om-extra input[data-ex-was]{width:5.5rem}
.msg-order-modal__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.msg-order-modal__hint{margin:0;font-size:11px;color:var(--muted);line-height:1.4}
.msg-order-modal__mirror{
  position:absolute;left:-9999px;top:0;visibility:hidden;white-space:pre;
  pointer-events:none;
}
@media (max-width:640px){
  .msg-order-modal__grid{grid-template-columns:1fr}
  .msg-order-modal__dialog{width:100%;max-height:96vh}
}
.msg-thread{
  flex:1 1 0%;
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:12px 16px 16px;
  display:flex;
  flex-direction:column;
  gap:8px;
  font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:color-mix(in srgb, var(--panel) 88%, #0b0f16);
  position:relative;
  z-index:1;
}
/* Разделитель дня: в потоке — обычная пилюля; сверху — ОДНА sticky (без полосы поверх фото) */
.msg-day-float{
  position:sticky;
  top:0;
  z-index:6;
  display:flex;
  justify-content:center;
  align-items:center;
  height:38px;
  margin:0 0 2px;
  padding:7px 0;
  overflow:visible;
  pointer-events:none;
  width:100%;
  max-width:none;
  align-self:stretch;
  flex:0 0 auto;
  /* Нельзя full-width градиент — он ложится белой полосой на фото при скролле */
  background:transparent;
}
.msg-day-float[hidden]{display:none!important}
.msg-day-float .msg-day-pill{
  margin-top:0;
  box-shadow:0 2px 10px rgba(0,0,0,.18);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.msg-day-sep{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
  align-items:center;
  height:38px;
  padding:7px 0;
  margin:0;
  width:100%;
  max-width:none;
  align-self:stretch;
  flex:0 0 auto;
  pointer-events:none;
}
.msg-day-sep.is-covered .msg-day-pill{opacity:0}
.msg-day-pill{
  display:inline-block;
  padding:3px 12px 5px;
  border-radius:8px;
  font-size:13px;
  font-weight:400;
  line-height:16px;
  letter-spacing:.01em;
  color:#939393;
  background:#222;
  user-select:none;
}
html[data-theme="light"] .msg-day-pill{
  color:#818c99;
  background:rgba(0,0,0,.06);
}
html[data-theme="light"] .msg-day-float .msg-day-pill{
  background:rgba(255,255,255,.92);
  box-shadow:0 2px 8px rgba(0,0,0,.1);
  border:1px solid rgba(0,0,0,.06);
}
/* Flat: входящие слева, исходящие справа (аватар снаружи) */
.msg-row{
  display:flex;align-items:flex-start;gap:10px;
  max-width:min(475px,100%);width:100%;
  box-sizing:border-box;
}
.msg-row--in,
.msg-row--system{align-self:flex-start;margin-right:auto;flex-direction:row}
.msg-row--out{align-self:flex-end;margin-left:auto;flex-direction:row-reverse}
.msg-row-main{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;align-items:stretch;max-width:100%}
.msg-avatar{
  flex:0 0 auto;width:36px;height:36px;border-radius:999px;
  background:rgba(148,163,184,.18);display:inline-flex;align-items:center;justify-content:center;
  margin:0;position:relative;overflow:hidden;
}
.msg-avatar--out{overflow:visible;background:rgba(56,189,248,.22)}
.msg-avatar--presence{overflow:visible}
.msg-avatar img{width:100%;height:100%;object-fit:cover;display:block;border-radius:999px}
.msg-avatar-fallback{
  font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--text);opacity:.85;user-select:none;
}
.msg-avatar-online{
  position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:999px;
  background:#64748b;border:2px solid var(--card, var(--bg, #41454b));box-sizing:border-box;
  pointer-events:none;z-index:3;box-shadow:0 0 0 1px rgba(0,0,0,.35);
}
.msg-avatar-online.is-online{background:#22c55e;box-shadow:0 0 0 1px rgba(34,197,94,.45)}
html[data-theme="light"] .msg-avatar-online{border-color:#fff}
.msg-row .msg-bubble{align-self:auto;margin:0;max-width:none;flex:1 1 auto;min-width:0}
.msg-row .msg-bubble-sender{
  font-size:12.5px;font-weight:500;margin:0 0 2px;color:var(--muted);line-height:14px;
}
.msg-row--out .msg-bubble-sender{color:rgba(255,255,255,.92);font-weight:500}
.msg-row--in .msg-bubble-sender{color:var(--muted)}
html[data-theme="light"] .msg-row--in .msg-bubble-sender{color:#64748b}
.account-avatar-block{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.account-avatar-preview{
  width:88px;height:88px;border-radius:999px;overflow:hidden;
  background:var(--surface-inset);border:1px solid var(--line);
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
}
.account-avatar-preview img{width:100%;height:100%;object-fit:cover;display:block}
.account-avatar-fallback{font-size:28px;font-weight:800;color:var(--muted)}
.account-avatar-name{font-size:18px;font-weight:800;margin-bottom:4px}
.account-avatar-meta{min-width:0;flex:1}
.msg-thread-empty{padding:28px 12px;text-align:center;color:var(--muted);font-size:13px}
.msg-bubble{
  flex:1 1 auto;min-width:0;width:auto;max-width:none;padding:8px 10px 6px;position:relative;
  border:0;box-shadow:none;line-height:18px;font-size:13px;font-weight:400;
  font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  word-wrap:break-word;box-sizing:border-box;
  align-self:auto;margin:0;color:var(--text);
}
.msg-bubble--in{
  align-self:auto;margin:0;background:var(--msg-in-bg);border-radius:14px 14px 14px 4px;
  box-shadow:none;color:var(--text);
}
.msg-bubble--out{
  align-self:auto;margin:0;background:var(--msg-out-bg);border-radius:14px 14px 4px 14px;
  box-shadow:none;color:var(--msg-out-text,var(--text));
}
.msg-bubble--system{
  align-self:auto;margin:0;background:transparent;border-radius:0;box-shadow:none;
  color:var(--text);padding:0;
  font-size:13px;font-weight:400;line-height:18px;max-width:none;
}
.msg-row--system .msg-bubble-sender{color:var(--muted)}
.msg-row--system .msg-avatar{opacity:.75}
.msg-bubble-sender{
  font-size:12.5px;font-weight:500;margin:0 0 2px;color:var(--muted);line-height:14px;
}
.msg-bubble--out .msg-bubble-sender{text-align:left;color:rgba(255,255,255,.92)}
.msg-bubble--in .msg-bubble-sender{text-align:left}
.msg-bubble-text{
  white-space:pre-wrap;display:block;overflow-wrap:anywhere;word-break:break-word;
  font-size:13px;line-height:18px;font-weight:400;
}
.msg-bubble--in .msg-bubble-text .msg-link{
  color:#38bdf8;text-decoration:underline;text-underline-offset:2px;word-break:break-all;
}
.msg-bubble--out .msg-bubble-text .msg-link{
  color:var(--msg-out-link,#dbeafe);text-decoration:underline;text-underline-offset:2px;word-break:break-all;
}
.msg-bubble-text .msg-link:hover{opacity:.9}
.msg-bubble-meta{
  flex:0 0 auto;align-self:flex-start;margin:0;padding:1px 0 0;
  font-size:11px;line-height:14px;opacity:.55;text-align:right;
  letter-spacing:0;user-select:none;display:inline-flex;align-items:center;justify-content:flex-end;gap:3px;
  float:none;position:static;color:var(--muted);white-space:nowrap;min-width:0;
}
.msg-row--in .msg-bubble-meta{opacity:.55}
.msg-row--out .msg-resend-btn{align-self:flex-end}
.msg-bubble-checks{
  width:16px;height:10px;display:inline-block;position:relative;flex:0 0 auto;
}
.msg-bubble-checks::before,
.msg-bubble-checks::after{
  content:"";position:absolute;width:7px;height:4px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(-45deg);top:1px;color:#94a3b8;
}
.msg-bubble-checks::before{left:1px;opacity:.85}
.msg-bubble-checks::after{left:6px}
.msg-bubble-checks--sent::before{display:none}
.msg-bubble-checks--sent::after{color:#94a3b8;left:4px}
.msg-bubble-checks--read::before,
.msg-bubble-checks--read::after{color:#3b82f6}
.msg-bubble-checks--failed::before{display:none}
.msg-bubble-checks--failed::after{color:#f87171;left:4px}
.msg-resend-btn{
  display:inline-flex;align-items:center;margin:6px 0 0;padding:5px 10px;
  border:1px solid var(--line);border-radius:8px;background:var(--surface-inset,rgba(148,163,184,.12));
  color:var(--text);font:inherit;font-size:12px;font-weight:600;cursor:pointer;
}
.msg-resend-btn:hover{border-color:var(--brand,#10b981);color:var(--brand,#10b981)}
.msg-resend-btn:disabled{opacity:.6;cursor:wait}
.msg-composer{
  display:flex;flex-direction:column;gap:0;padding:0 16px 16px;
  border-top:0;align-items:stretch;flex:0 0 auto;
  background:transparent;position:relative;
}
.msg-composer-row{display:flex;gap:0;width:100%;align-items:flex-end}
.msg-conv-item--team{
  border:1px solid rgba(124,58,237,.35);
  background:rgba(124,58,237,.08);
}
.msg-conv-item--team .msg-conv-name::before{
  content:"📌 ";
  font-size:.85em;
}
html[data-theme="light"] .msg-conv-item--team{
  background:rgba(124,58,237,.06);
  border-color:rgba(124,58,237,.28);
}
/* Другие редакторы CRM в этом диалоге */
.msg-operators-presence{
  display:none;
  margin:0 2px 6px;
  padding:0 4px;
  font-size:12px;
  line-height:1.35;
  color:var(--muted);
  font-weight:500;
}
.msg-operators-presence.is-on{display:block}
/* Композер: TailAdmin chat — flat card + brand send (не VK blue) */
.msg-composer-bar{
  --msg-comp-icon:var(--muted);
  --msg-comp-send:var(--brand);
  --msg-comp-send-empty:var(--muted);
  align-items:flex-end;
  min-height:44px;
  padding:0 6px;
  border-radius:var(--radius-sm,8px);
  background:var(--surface-inset);
  border:1px solid var(--line);
  box-shadow:none;
  gap:0;
}
html[data-theme="light"] .msg-composer-bar{
  --msg-comp-icon:var(--muted);
  --msg-comp-send:var(--brand);
  --msg-comp-send-empty:var(--muted);
  background:var(--card-bg);
  border:1px solid var(--line);
  box-shadow:none;
}
.msg-comp-field{flex:1;min-width:0;display:flex;align-items:center;padding:0 4px;align-self:stretch}
.msg-composer textarea{
  width:100%;resize:none !important;min-height:36px;max-height:160px;
  line-height:1.35;padding:10px 4px;border-radius:0;
  font-family:var(--font);font-size:15px;font-weight:400;
  border:0;background:transparent;color:var(--text);
  box-shadow:none;
  /* Высоту наращивает JS; скролл колёсиком остаётся. Без полосы —
     иначе на Windows «Всегда показывать полосы прокрутки» видны ▲▼. */
  overflow-x:hidden;
  overflow-y:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.msg-composer textarea::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}
.msg-composer textarea:focus{
  outline:none;box-shadow:none;
}
.msg-composer textarea::placeholder{color:#A0A5AB;opacity:1}
.msg-comp-tools{display:flex;align-items:center;gap:0;flex:0 0 auto;padding:0;align-self:stretch}
.msg-comp-tools > [hidden],
.msg-comp-icon[hidden],
.msg-comp-icon-glyph[hidden],
.msg-send-btn[hidden]{display:none !important}
.msg-comp-icon{
  position:relative;overflow:hidden;padding:0;cursor:pointer;flex-shrink:0;margin:0 0 4px;
  width:36px;height:36px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:0;color:var(--msg-comp-icon);font-size:20px;line-height:1;
  align-self:flex-end;
}
.msg-comp-icon:hover{color:var(--text);background:rgba(148,163,184,.12)}
/* Пусто — серый send; есть текст/файл — цветной (референс скринов) */
.msg-comp-icon--send,
.msg-send-btn.msg-comp-icon{
  background:transparent !important;color:var(--msg-comp-send);box-shadow:none;
}
.msg-comp-icon--send:hover,
.msg-send-btn.msg-comp-icon:hover{
  filter:none;background:rgba(148,163,184,.1) !important;color:var(--msg-comp-send);
}
.msg-comp-icon--send.is-empty,
.msg-send-btn.msg-comp-icon.is-empty{
  background:transparent !important;color:var(--msg-comp-send-empty);filter:none;
  cursor:default;
}
.msg-comp-icon--send.is-empty:hover,
.msg-send-btn.msg-comp-icon.is-empty:hover{
  color:var(--msg-comp-send-empty);background:transparent !important;
}

/* Ответ / выбор / контекстное меню сообщения */
.msg-reply-bar,
.msg-select-bar{
  display:flex;align-items:center;gap:10px;
  margin:0 0 8px;padding:8px 10px;
  border-radius:12px;border:1px solid var(--line);
  background:var(--surface-inset, rgba(148,163,184,.08));
}
.msg-reply-bar[hidden],
.msg-select-bar[hidden]{display:none !important}
.msg-reply-bar__body{flex:1;min-width:0}
.msg-reply-bar__label{font-size:12px;font-weight:700;color:#78A0CC;margin-bottom:2px}
.msg-reply-bar__text{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg-reply-bar__close{
  flex:0 0 auto;width:28px;height:28px;border:0;border-radius:999px;
  background:transparent;color:var(--muted);cursor:pointer;position:relative;
}
.msg-reply-bar__close::before{
  content:"\00D7";font-size:20px;line-height:1;position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
}
.msg-select-bar__count{
  min-width:1.5em;font-weight:800;font-size:14px;
}
.msg-select-check{
  flex:0 0 auto;align-self:center;margin:0 8px 0 0;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.msg-select-check input{position:absolute;opacity:0;width:1px;height:1px}
.msg-select-box{
  width:22px;height:22px;border-radius:999px;border:2px solid rgba(148,163,184,.55);
  background:transparent;
}
.msg-select-check input:checked + .msg-select-box{
  border-color:#78A0CC;background:#78A0CC;
  box-shadow:inset 0 0 0 3px #fff;
}
html[data-theme="light"] .msg-select-check input:checked + .msg-select-box{
  box-shadow:inset 0 0 0 3px #fff;
}
.msg-inbox.is-msg-select .msg-row{cursor:pointer}
.msg-inbox.is-msg-select .msg-actions-btn{display:none !important}

/* Обёртка контента + мета у пузыря */
.msg-bubble-wrap{
  display:flex;align-items:flex-start;justify-content:flex-start;gap:8px;max-width:100%;width:100%;
}
.msg-bubble-side{
  flex:0 0 auto;position:relative;display:flex;align-items:flex-start;justify-content:flex-end;
  min-width:40px;padding-top:2px;gap:4px;
}
.msg-row--in .msg-bubble-wrap{flex-direction:row}
.msg-row--out .msg-bubble-wrap{
  flex-direction:row-reverse;
  justify-content:flex-start;
}
.msg-row--out .msg-row-main{align-items:flex-end}
.msg-row--in .msg-row-main{align-items:flex-start}
.msg-actions-btn{
  position:absolute;right:100%;top:-2px;margin-right:2px;
  flex:0 0 auto;width:28px;height:28px;padding:0;border:0;
  border-radius:999px;background:transparent;color:var(--muted);
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;opacity:0;pointer-events:none;
  transition:opacity .15s ease, background .15s ease, color .15s ease;
  -webkit-tap-highlight-color:transparent;
}
.msg-actions-btn__ico{
  width:18px;height:18px;border-radius:999px;
  background:currentColor;
  -webkit-mask:no-repeat center / contain;
  mask:no-repeat center / contain;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='2'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Ccircle cx='19' cy='12' r='2'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='2'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Ccircle cx='19' cy='12' r='2'/%3E%3C/svg%3E");
}
.msg-row:hover .msg-actions-btn,
.msg-row.is-ctx-open .msg-actions-btn,
.msg-actions-btn.is-open,
.msg-actions-btn:focus-visible{
  opacity:1;pointer-events:auto;
}
.msg-actions-btn:hover,
.msg-actions-btn.is-open,
.msg-actions-btn:focus-visible{
  background:rgba(15,23,42,.08);color:var(--text);outline:none;
}
html[data-theme="dark"] .msg-actions-btn:hover,
html[data-theme="dark"] .msg-actions-btn.is-open,
html[data-theme="dark"] .msg-actions-btn:focus-visible{
  background:rgba(255,255,255,.12);
}
@media (hover: none), (pointer: coarse), (max-width: 720px){
  .msg-actions-btn{
    position:static;right:auto;top:auto;margin-right:0;
    opacity:.55;pointer-events:auto;
  }
  .msg-bubble-side{gap:2px;justify-content:flex-end}
  .msg-row--out .msg-bubble-side{order:0}
  .msg-row--out .msg-bubble-wrap{align-items:flex-end}
  .msg-row:hover .msg-actions-btn,
  .msg-row.is-ctx-open .msg-actions-btn{opacity:1}
}

.msg-ctx-backdrop{
  position:fixed;inset:0;z-index:11990;
  background:rgba(0,0,0,.28);
  -webkit-tap-highlight-color:transparent;
}
.msg-ctx-backdrop[hidden]{display:none !important}

.msg-ctx-menu{
  position:fixed;z-index:12000;width:min(92vw,300px);
  padding:0;border:0;background:transparent;
  box-shadow:none;
  font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
  display:flex;flex-direction:column;gap:8px;
}
/* Моб/планшет: long-press = наше меню, без системной панели «Скопировать/Найти/Перевести» */
@media (hover: none), (pointer: coarse), (max-width: 1024px){
  .msg-thread .msg-bubble,
  .msg-thread .msg-bubble-text,
  .msg-thread .msg-bubble-sender,
  .msg-thread .msg-bubble-meta{
    -webkit-user-select:none !important;
    user-select:none !important;
    -webkit-touch-callout:none !important;
  }
}
.msg-ctx-menu[hidden]{display:none !important}

.msg-ctx-react{
  display:flex;align-items:center;justify-content:space-between;gap:2px;
  padding:6px 8px;border-radius:999px;
  background:#fff;color:#1a1a1a;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 8px 28px rgba(0,0,0,.16), 0 2px 6px rgba(0,0,0,.06);
}
html[data-theme="dark"] .msg-ctx-react{
  background:#2a2b2d;color:#f0f1f2;border-color:rgba(255,255,255,.08);
  box-shadow:0 10px 32px rgba(0,0,0,.45);
}
.msg-ctx-react-btn{
  flex:1 1 0;min-width:0;height:36px;margin:0;padding:0;border:0;border-radius:999px;
  background:transparent;font-size:22px;line-height:1;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .12s ease, transform .12s ease;
}
.msg-ctx-react-btn:hover,
.msg-ctx-react-btn:focus-visible{
  background:rgba(15,23,42,.06);outline:none;transform:scale(1.08);
}
html[data-theme="dark"] .msg-ctx-react-btn:hover,
html[data-theme="dark"] .msg-ctx-react-btn:focus-visible{background:rgba(255,255,255,.1)}
.msg-ctx-react-more{
  flex:0 0 auto;width:32px;height:32px;margin:0 0 0 2px;padding:0;border:0;border-radius:999px;
  background:rgba(15,23,42,.06);color:#6b7280;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
html[data-theme="dark"] .msg-ctx-react-more{background:rgba(255,255,255,.1);color:#c4c7cc}
.msg-ctx-react-more__dots{
  width:16px;height:16px;background:currentColor;
  -webkit-mask:no-repeat center / contain;mask:no-repeat center / contain;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='2'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Ccircle cx='19' cy='12' r='2'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='2'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Ccircle cx='19' cy='12' r='2'/%3E%3C/svg%3E");
}

.msg-ctx-panel{
  padding:6px;border-radius:16px;
  background:#fff;color:#1a1a1a;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 8px 28px rgba(0,0,0,.16), 0 2px 6px rgba(0,0,0,.06);
}
html[data-theme="dark"] .msg-ctx-panel{
  background:#2a2b2d;color:#f0f1f2;border-color:rgba(255,255,255,.08);
  box-shadow:0 10px 32px rgba(0,0,0,.45);
}
.msg-ctx-item{
  display:flex;align-items:center;gap:12px;width:100%;
  padding:11px 12px;margin:0;border:0;border-radius:12px;
  background:transparent;color:inherit;font:inherit;font-size:15px;
  text-align:left;cursor:pointer;line-height:1.25;
}
.msg-ctx-item:hover,
.msg-ctx-item:focus-visible{background:rgba(15,23,42,.06);outline:none}
html[data-theme="dark"] .msg-ctx-item:hover,
html[data-theme="dark"] .msg-ctx-item:focus-visible{background:rgba(255,255,255,.08)}
.msg-ctx-item--danger{color:#e64646}
.msg-ctx-item--sub{position:relative;padding-right:28px}
.msg-ctx-chevron{
  position:absolute;right:10px;top:50%;width:8px;height:8px;margin-top:-4px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(-45deg);opacity:.45;
}
.msg-ctx-ico{
  flex:0 0 auto;width:20px;height:20px;opacity:.9;
  background:currentColor;
  -webkit-mask:no-repeat center / contain;
  mask:no-repeat center / contain;
}
.msg-ctx-ico--reply{-webkit-mask-image: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%3Cpolyline points='9 17 4 12 9 7'/%3E%3Cpath d='M20 18v-2a4 4 0 0 0-4-4H4'/%3E%3C/svg%3E");mask-image: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%3Cpolyline points='9 17 4 12 9 7'/%3E%3Cpath d='M20 18v-2a4 4 0 0 0-4-4H4'/%3E%3C/svg%3E")}
.msg-ctx-ico--forward{-webkit-mask-image: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%3Cpolyline points='15 17 20 12 15 7'/%3E%3Cpath d='M4 18v-2a4 4 0 0 1 4-4h12'/%3E%3C/svg%3E");mask-image: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%3Cpolyline points='15 17 20 12 15 7'/%3E%3Cpath d='M4 18v-2a4 4 0 0 1 4-4h12'/%3E%3C/svg%3E")}
.msg-ctx-ico--copy{-webkit-mask-image: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%3Crect x='9' y='9' width='13' height='13' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E");mask-image: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%3Crect x='9' y='9' width='13' height='13' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E")}
.msg-ctx-ico--edit{-webkit-mask-image: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='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E");mask-image: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='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E")}
.msg-ctx-ico--delete{-webkit-mask-image: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%3Cpolyline points='3 6 5 6 21 6'/%3E%3Cpath d='M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3Cpath d='M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2'/%3E%3C/svg%3E");mask-image: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%3Cpolyline points='3 6 5 6 21 6'/%3E%3Cpath d='M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3Cpath d='M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2'/%3E%3C/svg%3E")}
.msg-ctx-ico--select{-webkit-mask-image: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%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolyline points='8 12 11 15 16 9'/%3E%3C/svg%3E");mask-image: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%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolyline points='8 12 11 15 16 9'/%3E%3C/svg%3E")}
.msg-ctx-submenu{
  margin-top:4px;max-height:220px;overflow:auto;
  border-top:1px solid rgba(0,0,0,.08);padding-top:4px;
}
html[data-theme="dark"] .msg-ctx-submenu{border-top-color:rgba(255,255,255,.1)}
.msg-ctx-submenu[hidden]{display:none !important}
.msg-ctx-empty{padding:10px 12px;font-size:13px;color:#888}

.msg-attach-btn{
  position:relative;overflow:hidden;
}
.msg-attach-btn input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}
.msg-attach-btn[aria-disabled="true"]{opacity:.45;pointer-events:none}
.msg-attach-preview{
  width:100%;padding:4px 2px 8px;border-bottom:0;
}
.msg-attach-preview[hidden]{display:none !important}
.msg-attach-gallery{
  display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;
  max-height:min(28vh,220px);overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.msg-attach-tile{
  position:relative;width:96px;height:96px;flex:0 0 auto;
  border-radius:12px;overflow:hidden;
  background:rgba(15,23,42,.55);border:1px solid rgba(148,163,184,.22);
  color:#f8fafc;cursor:default;
}
html[data-theme="light"] .msg-attach-tile{
  background:#e8eef5;border-color:rgba(15,23,42,.12);color:#303238;
}
.msg-attach-tile__media{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
}
.msg-attach-tile__icon{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:28px;opacity:.85;user-select:none;
}
.msg-attach-tile__meta{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:14px 6px 5px;font-size:10px;font-weight:700;line-height:1.2;
  letter-spacing:.01em;text-transform:uppercase;color:#fff;
  background:linear-gradient(transparent,rgba(0,0,0,.72));
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  pointer-events:none;
}
.msg-attach-tile__remove{
  position:absolute;top:4px;right:4px;z-index:4;
  width:22px;height:22px;border-radius:999px;padding:0;
  border:0;cursor:pointer;
  background:rgba(255,255,255,.92);color:#303238;
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 1px 4px rgba(0,0,0,.35);
}
.msg-attach-tile__remove::before{content:"\00D7";font-size:15px;line-height:1;font-weight:700}
.msg-attach-tile__remove:hover{background:#fff}
.msg-attach-tile.is-uploading .msg-attach-tile__media,
.msg-attach-tile.is-uploading .msg-attach-tile__icon{filter:brightness(.45)}
.msg-attach-tile__upload{
  position:absolute;inset:0;z-index:5;
  display:flex;align-items:center;justify-content:center;
  background:rgba(15,23,42,.38);
  pointer-events:auto;
}
.msg-attach-tile__upload .msg-upload-ring{
  width:44px;height:44px;
  pointer-events:none;
}
.msg-attach-tile__upload-cancel{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:6;
  width:28px;height:28px;border-radius:999px;padding:0;border:0;cursor:pointer;
  background:rgba(255,255,255,.96);color:#303238;
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 1px 6px rgba(0,0,0,.3);
  opacity:1;
}
.msg-attach-tile__upload-cancel::before{content:"\00D7";font-size:16px;line-height:1;font-weight:700}
.msg-attach-tile.is-uploading .msg-attach-tile__upload-cancel{pointer-events:none;opacity:.92}
.msg-upload-ring{
  width:40px;height:40px;display:block;
  transform:rotate(-90deg);
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.35));
}
.msg-upload-ring__track{
  stroke:rgba(255,255,255,.35);stroke-width:3;
}
.msg-upload-ring__prog{
  stroke:#fff;stroke-width:3;stroke-linecap:round;
  transition:stroke-dashoffset .12s linear;
}
.msg-comp-icon--send.is-uploading,
.msg-send-btn.msg-comp-icon.is-uploading{
  color:var(--msg-comp-send) !important;
  pointer-events:none;
}
.msg-comp-icon--send.is-uploading .msg-upload-ring,
.msg-send-btn.msg-comp-icon.is-uploading .msg-upload-ring{
  width:22px;height:22px;
  filter:none;
}
.msg-comp-icon--send.is-uploading .msg-upload-ring__track,
.msg-send-btn.msg-comp-icon.is-uploading .msg-upload-ring__track{
  stroke:rgba(148,163,184,.45);
}
.msg-comp-icon--send.is-uploading .msg-upload-ring__prog,
.msg-send-btn.msg-comp-icon.is-uploading .msg-upload-ring__prog{
  stroke:var(--msg-comp-send,#529EF4);
}
html[data-theme="light"] .msg-attach-tile__upload{background:rgba(15,23,42,.22)}
.msg-attach-tile__open{
  position:absolute;inset:0;z-index:3;
  display:flex;align-items:center;justify-content:center;
  background:rgba(2,6,23,.42);border:0;padding:0;cursor:pointer;
  opacity:0;transition:opacity .15s ease;color:#fff;
}
.msg-attach-tile:hover .msg-attach-tile__open,
.msg-attach-tile:focus-within .msg-attach-tile__open{opacity:1}
.msg-attach-tile__open-icon{
  position:relative;width:36px;height:36px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(15,23,42,.72);border:1px solid rgba(255,255,255,.35);
  box-shadow:0 2px 10px rgba(0,0,0,.35);
}
.msg-attach-tile__open-icon::before{
  content:"";width:12px;height:12px;border:2px solid #fff;border-radius:50%;
  box-sizing:border-box;display:block;
}
.msg-attach-tile__open-icon::after{
  content:"";position:absolute;width:7px;height:2px;background:#fff;
  border-radius:1px;transform:rotate(45deg);right:9px;bottom:10px;
}
.msg-attach-warn{width:100%;font-size:12px;color:var(--warn,#f59e0b);padding:2px 2px 0}
.msg-comp-icon-glyph{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;font-weight:500}
.msg-comp-icon-glyph--emoji::before{content:"☺";font-size:1.15em}
/* Иконка «открыть шаблоны» — 3 линии разной длины (референс) */
.msg-comp-icon-glyph--tpl{
  position:relative;width:18px;height:14px;
}
.msg-comp-icon-glyph--tpl::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:100%;
  background:
    linear-gradient(currentColor,currentColor) 0 0 / 100% 2.5px no-repeat,
    linear-gradient(currentColor,currentColor) 0 50% / 78% 2.5px no-repeat,
    linear-gradient(currentColor,currentColor) 0 100% / 52% 2.5px no-repeat;
  border-radius:1px;
}
/* Одна кнопка: в режиме «закрыть» — рамка + шеврон вниз */
.msg-comp-icon.is-tpl-open{
  border:1.5px solid rgba(255,255,255,.55);
  border-radius:10px;
  width:36px;height:36px;
}
html[data-theme="light"] .msg-comp-icon.is-tpl-open{border-color:rgba(15,23,42,.35)}
.msg-comp-icon-glyph--tpl-close{
  position:relative;width:12px;height:8px;
}
.msg-comp-icon-glyph--tpl-close::before{
  content:"";position:absolute;left:1px;top:0;
  width:8px;height:8px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg);box-sizing:border-box;
}
/* legacy (панель шаблонов / старый markup) */
.msg-comp-icon--tpl-close{
  border:1.5px solid rgba(255,255,255,.55);
  border-radius:10px;
  width:36px;height:36px;
}
html[data-theme="light"] .msg-comp-icon--tpl-close{border-color:rgba(15,23,42,.35)}
.msg-comp-icon-glyph--send::before{content:"➤";font-size:.9em;margin-left:1px}
.msg-emoji-panel{
  position:absolute;left:10px;right:10px;bottom:calc(100% - 4px);z-index:30;
  display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:2px;
  max-height:220px;overflow:auto;padding:10px;border-radius:14px;
  background:var(--panel);border:1px solid var(--line);
  box-shadow:0 10px 28px rgba(0,0,0,.35);
  touch-action:manipulation;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.msg-emoji-panel[hidden]{display:none !important}

/* Черновик AI — компактная панель над композером */
.msg-ai-draft{
  margin:0 10px 6px;padding:6px 8px;border-radius:10px;
  border:1px solid var(--line);background:var(--surface-inset,var(--panel));
}
.msg-ai-draft[hidden]{display:none !important}
.msg-ai-draft__bar{display:flex;align-items:center;gap:4px;min-height:28px}
.msg-ai-draft__meta{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40%;min-width:0}
.msg-ai-draft__meta.is-error{
  max-width:min(72%,100%);flex:1 1 auto;color:#f87171;white-space:normal;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
html[data-theme="light"] .msg-ai-draft__meta.is-error{color:#dc2626}
.msg-ai-draft__badge{
  font-size:10px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;
  padding:2px 6px;border-radius:6px;border:1px solid var(--line);
  color:var(--brand,#10b981);background:var(--surface-nested,rgba(16,185,129,.12));
  flex:0 0 auto;
}
.msg-ai-draft__badge[hidden]{display:none !important}
.msg-ai-draft__spacer{flex:1 1 auto}
.msg-ai-ico{
  width:28px;height:28px;padding:0;border-radius:8px;border:1px solid var(--line);
  background:transparent;color:var(--text);cursor:pointer;display:inline-flex;
  align-items:center;justify-content:center;flex:0 0 auto;line-height:1;
}
.msg-ai-ico:hover{background:var(--surface-nested,rgba(127,127,127,.12))}
.msg-ai-ico:disabled{opacity:.35;cursor:default}
.msg-ai-ico--text{font-size:14px;font-weight:700}
.msg-ai-ico__chev{
  width:10px;height:10px;display:block;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
}
.msg-ai-ico__chev--prev{transform:rotate(135deg);margin-left:2px}
.msg-ai-ico__chev--next{transform:rotate(-45deg);margin-right:2px}
.msg-ai-draft__body{
  white-space:pre-wrap;word-break:break-word;font-size:13px;line-height:1.35;
  max-height:140px;overflow-x:hidden;overflow-y:auto;
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;
  color:var(--text);margin-top:6px;padding:6px 2px 4px 0;border-top:1px solid var(--line);
}
.msg-ai-draft__body[hidden]{display:none !important}
@media (max-width:720px){
  .msg-ai-draft__body{max-height:min(38vh,220px)}
}

/* Профиль клиента (W7) — только по кнопке «Профиль» в «Управление заказом» */
.msg-peer-profile{
  margin:0 10px 6px;padding:8px;border-radius:10px;
  border:1px solid var(--line);background:var(--surface-inset,var(--panel));
}
.msg-peer-profile[hidden]{display:none !important}
.msg-peer-profile__bar{
  display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px;
}
.msg-peer-profile__title{font-size:12px;font-weight:700;color:var(--muted);min-width:0}
.msg-peer-profile__close{
  flex-shrink:0;width:28px;height:28px;margin:0;padding:0;border:0;border-radius:8px;
  background:transparent;color:var(--muted);cursor:pointer;font-size:20px;line-height:1;
}
.msg-peer-profile__close:hover{background:rgba(148,163,184,.12);color:var(--text)}
.msg-peer-profile__grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;
}
.msg-peer-profile__form{padding-bottom:2px}
.msg-peer-profile__form .field{margin:0}
.msg-peer-profile__form input,
.msg-peer-profile__form select,
.msg-peer-profile__form textarea{
  width:100%;font-size:13px;
}
.msg-peer-profile__actions{
  display:flex;align-items:center;gap:8px;margin-top:6px;
}
@media (max-width:720px){
  .msg-peer-profile__grid{grid-template-columns:1fr 1fr}
}

/* Очередь подтверждения в чате (W3b) */
.msg-ai-approval{
  margin:0 10px 6px;padding:8px;border-radius:10px;
  border:1px solid var(--line);background:var(--surface-nested,rgba(245,158,11,.08));
}
.msg-ai-approval[hidden]{display:none !important}
.msg-ai-approval__bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.msg-ai-approval__title{font-size:12px;font-weight:700;color:var(--text)}
.msg-ai-approval__mode{font-size:11px}
.msg-ai-approval__text{
  width:100%;min-height:64px;font-size:13px;line-height:1.35;
  resize:vertical;border-radius:8px;border:1px solid var(--line);
  background:var(--surface-inset,var(--panel));color:var(--text);padding:8px;
}
.msg-approvals-list{display:flex;flex-direction:column;gap:12px}
.msg-approval-card{padding:12px;border-radius:10px;border:1px solid var(--line)}
.msg-approval-card__head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:8px}
.msg-approval-text{width:100%;font-size:13px;line-height:1.35;resize:vertical}
.msg-approval-actions{margin-top:8px;display:flex;gap:8px}
.msg-approval-dismiss{margin-top:6px}

/* Панель шаблонов ответов */
.msg-tpl-panel{
  position:absolute;left:8px;right:8px;bottom:calc(100% - 2px);z-index:35;
  display:flex;flex-direction:column;gap:8px;
  max-height:min(58vh,480px);overflow:hidden;
  padding:10px 12px 12px;border-radius:16px;
  background:var(--panel);border:1px solid var(--line);
  box-shadow:0 12px 32px rgba(0,0,0,.4);
}
.msg-tpl-panel--manage{max-height:min(72vh,620px)}
.msg-tpl-panel[hidden]{display:none !important}
.msg-tpl-panel__head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  flex:0 0 auto;
}
.msg-tpl-panel__title{font-weight:800;font-size:14px}
.msg-tpl-panel__head-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.msg-tpl-panel__cats{
  display:flex;flex-wrap:nowrap;align-items:center;gap:6px;
  flex:0 0 auto;overflow-x:auto;overflow-y:hidden;padding:2px 0 4px;
  -webkit-overflow-scrolling:touch;scrollbar-width:thin;
}
.msg-tpl-cat{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  box-sizing:border-box;min-height:32px;height:auto;
  border:1px solid var(--line);background:rgba(148,163,184,.08);
  color:var(--text);border-radius:999px;padding:7px 12px;font-size:12px;font-weight:700;
  line-height:1.2;cursor:pointer;white-space:nowrap;
}
.msg-tpl-cat.is-on{border-color:var(--brand);background:rgba(16,185,129,.16);color:var(--brand)}
.msg-tpl-panel__list{
  flex:1 1 auto;min-height:140px;overflow:auto;display:flex;flex-direction:column;gap:6px;
  -webkit-overflow-scrolling:touch;
}
.msg-tpl-panel--manage .msg-tpl-panel__list{min-height:120px;flex:1 1 40%}
.msg-tpl-item{
  flex:0 0 auto;text-align:left;border:1px solid var(--line);background:rgba(148,163,184,.06);
  border-radius:12px;padding:10px 12px;cursor:pointer;color:var(--text);
}
.msg-tpl-item:hover{border-color:rgba(16,185,129,.45);background:rgba(16,185,129,.08)}
.msg-tpl-item__title{font-weight:700;font-size:13px;margin:0 0 4px;word-break:break-word}
.msg-tpl-item__preview{font-size:12px;color:var(--muted);line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  overflow-wrap:anywhere;word-break:break-word}
.msg-tpl-item__actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.msg-tpl-item__actions .btn{flex:0 0 auto}
.msg-tpl-panel__manage{
  border-top:1px solid var(--line);padding-top:10px;
  display:flex;flex-direction:column;gap:8px;
  flex:0 1 auto;min-height:0;max-height:48%;overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.msg-tpl-panel__manage[hidden]{display:none !important}
.msg-tpl-manage-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.msg-tpl-manage-row input[type="text"],
.msg-tpl-manage-row select,
.msg-tpl-panel__manage textarea{
  flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;
  background:var(--surface-inset,rgba(0,0,0,.2));color:var(--text);
  padding:8px 10px;font:inherit;
}
.msg-tpl-panel__manage textarea{width:100%;resize:vertical;min-height:72px;max-height:140px}
.msg-tpl-empty{padding:16px 8px;text-align:center;color:var(--muted);font-size:13px}
@media (max-width:720px){
  .msg-tpl-panel{
    left:4px;right:4px;max-height:min(62vh,520px);
    padding:8px 10px 10px;border-radius:14px;
  }
  .msg-tpl-panel--manage{max-height:min(78vh,640px)}
  .msg-tpl-panel__list{min-height:110px}
  .msg-tpl-panel--manage .msg-tpl-panel__list{
    min-height:88px;flex:0 1 auto;max-height:min(28vh,200px);
  }
  .msg-tpl-cat{min-height:34px;padding:8px 14px;font-size:13px}
  .msg-tpl-panel__manage{max-height:min(48vh,340px);flex:1 1 auto}
  .msg-tpl-panel__manage textarea{min-height:56px;max-height:100px}
  .msg-tpl-item__actions .btn{min-height:34px;padding:6px 12px}
}
.msg-emoji-btn{
  appearance:none;border:0;background:transparent;border-radius:8px;cursor:pointer;
  font-size:22px;line-height:1.2;padding:6px 0;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
  user-select:none;
}
.msg-emoji-btn:hover{background:rgba(148,163,184,.14)}
.msg-voice-rec{
  width:100%;display:flex;align-items:center;gap:10px;padding:6px 4px 2px;
  color:var(--text);font-size:13px;
}
.msg-voice-rec[hidden]{display:none !important}
.msg-voice-rec-cancel{
  width:36px;height:36px;border-radius:999px;border:0;cursor:pointer;
  background:rgba(239,68,68,.15);color:#f87171;font-size:14px;
}
.msg-voice-rec-pulse{
  width:10px;height:10px;border-radius:999px;background:#ef4444;
  animation:msg-voice-blink 1s ease-in-out infinite;
}
@keyframes msg-voice-blink{50%{opacity:.35}}
.msg-voice-rec-time{font-variant-numeric:tabular-nums;font-weight:700;min-width:3ch}
.msg-voice-rec-label{flex:1;color:var(--muted);min-width:0}
.msg-voice-rec-send{flex:0 0 auto}
.msg-att{display:block;margin:4px 0 4px}
.msg-bubble .msg-att:first-child{margin-top:2px}
.msg-bubble .msg-att--photo img{border-radius:10px;border-color:rgba(255,255,255,.12)}
.msg-bubble--out .msg-att--photo img{border-color:rgba(255,255,255,.18)}
.msg-att--photo img{display:block;max-width:min(360px,100%);max-height:420px;width:auto;height:auto;object-fit:contain;border-radius:10px;border:1px solid var(--line);background:var(--surface-inset,rgba(148,163,184,.12))}
.msg-att--photo img.is-broken{
  width:min(280px,100%);min-height:120px;height:120px;object-fit:none;
  background:var(--surface-inset,rgba(148,163,184,.14));
  box-shadow:inset 0 0 0 1px var(--line);
  position:relative;
}
.msg-att--photo a:has(img.is-broken)::after,
.msg-att--photo:has(img.is-broken)::after{
  content:"Фото недоступно";
  display:block;margin-top:4px;font-size:12px;color:var(--muted);
}
.msg-att-album{
  display:grid;gap:4px;max-width:min(320px,100%);
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.msg-att-album[data-count="3"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.msg-att-album[data-count="3"] .msg-att-album__item:first-child{grid-column:1 / -1}
.msg-att-album[data-count="1"]{grid-template-columns:1fr}
.msg-att-album[data-count="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.msg-att-album[data-count="5"],
.msg-att-album[data-count="6"],
.msg-att-album[data-count="7"],
.msg-att-album[data-count="8"],
.msg-att-album[data-count="9"],
.msg-att-album[data-count="10"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.msg-att-album[data-count="5"] .msg-att-album__item:first-child,
.msg-att-album[data-count="7"] .msg-att-album__item:first-child,
.msg-att-album[data-count="8"] .msg-att-album__item:first-child,
.msg-att-album[data-count="10"] .msg-att-album__item:first-child{grid-column:1 / -1}
.msg-att-album[data-count="5"] .msg-att-album__item:first-child img,
.msg-att-album[data-count="7"] .msg-att-album__item:first-child img,
.msg-att-album[data-count="8"] .msg-att-album__item:first-child img,
.msg-att-album[data-count="10"] .msg-att-album__item:first-child img{height:160px}
.msg-att-album__item{margin:0;min-width:0}
.msg-att-album .msg-att--photo img{
  width:100%;height:120px;max-height:none;max-width:none;object-fit:cover;border-radius:8px;
}
.msg-att-album[data-count="3"] .msg-att-album__item:first-child img{height:160px}
.msg-att-album .msg-att--video video{
  width:100%;height:120px;object-fit:cover;border-radius:8px;display:block;
}
.msg-att--video video{display:block;max-width:min(320px,100%);max-height:240px;border-radius:10px;background:#000}
.msg-att--voice{margin:2px 0 4px}
.msg-bubble .msg-voice{max-width:100%;width:100%}
.msg-voice{
  display:grid;
  grid-template-columns:36px minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  align-items:center;column-gap:8px;row-gap:6px;
  width:100%;max-width:100%;min-width:0;
  padding:2px 0;--voice-progress:0;--voice-track-w:112px;
  box-sizing:border-box;
}
.msg-voice-play{grid-column:1;grid-row:1}
.msg-voice-body{grid-column:2;grid-row:1}
.msg-voice-asr{grid-column:3;grid-row:1;align-self:center}
.msg-voice-transcript{
  grid-column:2 / -1;grid-row:2;width:100%;margin:0;
  font-size:13px;line-height:1.35;color:var(--muted,#94a3b8);
}
.msg-voice-transcript-text{white-space:pre-wrap;word-break:break-word}
.msg-bubble--out .msg-voice-transcript{color:rgba(255,255,255,.82)}
.msg-voice audio{display:none}
.msg-voice-play{
  flex:0 0 auto;width:36px;height:36px;border-radius:999px;border:0;cursor:pointer;
  background:#71aaeb;color:#fff;position:relative;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.msg-voice-play::before{
  content:"";position:absolute;left:14px;top:11px;
  border-style:solid;border-width:7px 0 7px 11px;
  border-color:transparent transparent transparent currentColor;
}
.msg-voice.is-playing .msg-voice-play::before{
  left:12px;top:11px;width:4px;height:14px;border:0;background:currentColor;
  box-shadow:6px 0 0 currentColor;
}
.msg-voice.is-loading .msg-voice-play{opacity:.55;cursor:wait}
.msg-voice.is-loading .msg-voice-time{opacity:.9}
.msg-bubble--out .msg-voice-play{background:rgba(255,255,255,.92);color:#2563eb}
.msg-bubble--in .msg-voice-play{background:#71aaeb;color:#fff}
.msg-voice-body{
  flex:1 1 auto;min-width:0;display:flex;flex-direction:row;align-items:center;gap:8px;
}
.msg-voice-track{
  position:relative;flex:0 1 auto;width:var(--voice-track-w,112px);
  max-width:min(220px,52vw);min-width:72px;height:26px;
  display:flex;align-items:center;cursor:pointer;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.msg-voice-wave{
  display:flex;align-items:center;gap:1.5px;width:100%;height:22px;pointer-events:none;
  opacity:.95;
}
.msg-voice-wave i{
  display:block;flex:1 1 0;min-width:2px;max-width:3px;height:calc(var(--h,40) * 1%);
  min-height:4px;max-height:100%;border-radius:1px;background:rgba(113,170,235,.55);
}
.msg-bubble--out .msg-voice-wave i{background:rgba(255,255,255,.55)}
.msg-bubble--in .msg-voice-wave i{background:rgba(113,170,235,.55)}
.msg-voice-seek{
  position:absolute;left:0;right:0;top:0;bottom:0;margin:0;width:100%;height:100%;
  -webkit-appearance:none;appearance:none;background:transparent;outline:none;cursor:pointer;z-index:2;
  opacity:0;touch-action:pan-x;
}
.msg-voice-seek::-webkit-slider-thumb{
  -webkit-appearance:none;width:12px;height:22px;border-radius:0;background:transparent;border:0;cursor:pointer;
}
.msg-voice-seek::-moz-range-thumb{width:12px;height:22px;border:0;background:transparent;cursor:pointer}
.msg-voice-time{
  flex:0 0 auto;min-width:2.6em;font-size:12px;line-height:1.2;font-weight:600;
  color:var(--muted,#94a3b8);font-variant-numeric:tabular-nums;text-align:right;
}
.msg-bubble--out .msg-voice-time{color:rgba(255,255,255,.88)}
.msg-bubble--in .msg-voice-time{color:#64748b}
html[data-theme="light"] .msg-bubble--in .msg-voice-time{color:#64748b}
html[data-theme="light"] .msg-bubble--out .msg-voice-time{color:rgba(255,255,255,.92)}
.msg-voice-asr{
  flex:0 0 auto;min-width:32px;height:20px;padding:0 8px;border-radius:999px;border:0;cursor:pointer;
  font-size:11px;font-weight:600;letter-spacing:.02em;line-height:20px;
  background:rgba(148,163,184,.18);color:var(--muted,#94a3b8);
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.msg-bubble--out .msg-voice-asr{background:rgba(255,255,255,.18);color:rgba(255,255,255,.82)}
.msg-voice-asr.is-active,.msg-voice-asr:hover{background:rgba(113,170,235,.28);color:#71aaeb}
.msg-bubble--out .msg-voice-asr.is-active,.msg-bubble--out .msg-voice-asr:hover{
  background:rgba(255,255,255,.28);color:#fff;
}
.msg-voice-transcript-stub{opacity:.85;font-size:12px}
@media (max-width:720px){
  .msg-voice{column-gap:6px;row-gap:4px}
  .msg-voice-track{max-width:min(180px,calc(100vw - 148px))}
  .msg-voice-asr{min-width:28px;height:22px;padding:0 6px;font-size:10px}
}
.msg-att--file{font-size:13px;font-weight:600}
.msg-att--pdf{
  display:block;width:min(196px,58vw);max-width:100%;border-radius:12px;overflow:hidden;
  border:1px solid var(--line,rgba(148,163,184,.35));background:var(--surface-inset,#303238);
  cursor:pointer;text-align:left;color:inherit;padding:0;margin:4px 0 2px;
  box-shadow:0 1px 2px rgba(0,0,0,.06);
}
.msg-att--pdf:focus-visible{outline:2px solid var(--brand,#10b981);outline-offset:2px}
.msg-att-pdf__preview{
  display:block;position:relative;overflow:hidden;
  width:100%;aspect-ratio:1 / 1.414;min-height:248px;max-height:320px;
  background:#e2e8f0;
}
.msg-att-pdf__fallback{
  position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;background:linear-gradient(160deg,#f8fafc 0%,#e2e8f0 55%,#cbd5e1 100%);color:#334155;
}
.msg-att-pdf__fallback-icon{
  display:inline-flex;align-items:center;justify-content:center;min-width:52px;min-height:64px;
  border-radius:10px;background:#ef4444;color:#fff;font-size:14px;font-weight:800;letter-spacing:.04em;
  box-shadow:0 8px 20px rgba(239,68,68,.28);
}
.msg-att-pdf__fallback-text{font-size:12px;font-weight:600;opacity:.8;text-align:center;padding:0 10px}
.msg-att-pdf__preview iframe{
  position:absolute;inset:0;z-index:1;width:100%;height:100%;border:0;pointer-events:none;background:transparent;
}
.msg-bubble--out .msg-att-pdf__fallback{
  background:linear-gradient(160deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,.08) 100%);color:rgba(255,255,255,.92);
}
.msg-att-pdf__bar{
  display:flex;align-items:center;gap:8px;padding:8px 10px;min-height:40px;
  background:var(--surface-nested,rgba(15,23,42,.72));
}
.msg-att-pdf__badge{
  flex:0 0 auto;font-size:10px;font-weight:800;letter-spacing:.04em;color:#fff;
  background:#ef4444;border-radius:6px;padding:3px 6px;line-height:1;
}
.msg-att-pdf__name{
  flex:1 1 auto;min-width:0;font-size:12px;font-weight:600;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text,#e2e8f0);
}
.msg-att-pdf__hint{
  flex:0 0 auto;font-size:11px;font-weight:600;color:var(--brand,#10b981);
}
.msg-att-pdf__actions{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;
}
.msg-att-pdf__download{
  font-size:11px;font-weight:700;color:var(--brand,#10b981);text-decoration:none;
  padding:2px 0;border-bottom:1px solid transparent;
}
.msg-att-pdf__download:hover{border-bottom-color:currentColor}
.msg-bubble--out .msg-att-pdf__download{color:#a7f3d0}
.msg-bubble--out .msg-att--pdf{border-color:rgba(255,255,255,.18)}
.msg-bubble--out .msg-att-pdf__bar{background:rgba(0,0,0,.18)}
.msg-bubble--out .msg-att-pdf__name{color:#fff}
body.msg-pdf-viewer-open{overflow:hidden}
.msg-pdf-viewer{
  position:fixed;inset:0;z-index:12000;display:flex;align-items:center;justify-content:center;
  padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
}
.msg-pdf-viewer[hidden]{display:none !important}
.msg-pdf-viewer__backdrop{position:absolute;inset:0;background:var(--backdrop-scrim);backdrop-filter:none}
.msg-pdf-viewer__panel{
  position:relative;z-index:1;display:flex;flex-direction:column;width:min(960px,100%);
  height:min(92dvh,960px);border-radius:var(--radius);overflow:hidden;
  background:var(--card-bg);border:1px solid var(--line);box-shadow:var(--shadow);
}
.msg-pdf-viewer__toolbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 12px;background:var(--surface-inset);border-bottom:1px solid var(--line);
}
.msg-pdf-viewer__title{
  min-width:0;flex:1 1 auto;font-size:13px;font-weight:600;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.msg-pdf-viewer__actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.msg-pdf-viewer__btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;
  border-radius:var(--radius-sm,8px);border:1px solid var(--line);background:var(--card-bg);
  color:var(--text);font-size:12px;font-weight:500;text-decoration:none;cursor:pointer;
}
.msg-pdf-viewer__btn:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--line));background:var(--surface-brand-soft);color:var(--text)}
.msg-pdf-viewer__btn--close{width:34px;padding:0}
.msg-pdf-viewer__btn--close::before{content:"\00D7";font-size:22px;line-height:1}
.msg-pdf-viewer__frame{flex:1 1 auto;width:100%;border:0;background:#525659}
@media (max-width:720px){
  .msg-att--pdf{width:min(168px,62vw)}
  .msg-att-pdf__preview{min-height:210px;max-height:280px}
  .msg-pdf-viewer__panel{height:min(94dvh,100%);border-radius:10px}
}
.msg-att--missing{color:var(--muted)}
.msg-att--vk-video{
  position:relative;display:inline-block;max-width:min(280px,70vw);border-radius:12px;overflow:hidden;
  background:#303238;text-decoration:none;color:inherit;
}
.msg-att--vk-video img{
  display:block;width:100%;max-height:320px;object-fit:cover;border-radius:12px;
}
.msg-att-vk-video__badge{
  position:absolute;left:10px;bottom:10px;z-index:2;padding:4px 8px;border-radius:999px;
  font-size:12px;font-weight:600;line-height:1.2;background:rgba(0,0,0,.62);color:#fff;
}
.msg-att-vk-video__title{
  display:block;padding:6px 10px 8px;font-size:12px;line-height:1.3;color:var(--muted,#94a3b8);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px;
}
.msg-att--product{
  display:flex;align-items:center;gap:10px;max-width:min(320px,78vw);
  padding:8px;border-radius:12px;text-decoration:none;color:inherit;
  background:color-mix(in srgb, var(--line,#e2e8f0) 55%, transparent);
  border:1px solid var(--line,#e2e8f0);
}
.msg-att-product__thumb{
  width:56px;height:56px;object-fit:cover;border-radius:8px;flex:0 0 auto;background:#303238;
}
.msg-att-product__thumb--empty{
  display:inline-block;background:color-mix(in srgb, var(--muted,#94a3b8) 25%, transparent);
}
.msg-att-product__body{display:flex;flex-direction:column;gap:2px;min-width:0}
.msg-att-product__title{
  font-size:13px;font-weight:700;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.msg-att-product__price{font-size:12px;color:var(--muted,#64748b);font-weight:600}
.msg-att--photo{cursor:zoom-in}
.msg-att--photo img{cursor:zoom-in}
body.msg-lightbox-open{overflow:hidden}
.msg-lightbox{
  position:fixed;inset:0;z-index:1400;display:flex;align-items:center;justify-content:center;
  padding:max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
}
.msg-lightbox[hidden]{display:none !important}
.msg-lightbox__backdrop{position:absolute;inset:0;background:rgba(2,6,23,.88);backdrop-filter:blur(4px)}
.msg-lightbox__stage{
  position:relative;z-index:1;max-width:min(96vw,1100px);max-height:92dvh;
  display:flex;flex-direction:column;align-items:center;gap:10px;
}
.msg-lightbox__img{
  display:block;max-width:100%;max-height:min(82dvh,900px);width:auto;height:auto;
  object-fit:contain;border-radius:12px;box-shadow:0 16px 48px rgba(0,0,0,.45);
  background:#303238;
}
.msg-lightbox__counter{
  color:#e2e8f0;font-size:13px;font-weight:600;letter-spacing:.02em;
  background:rgba(15,23,42,.65);padding:4px 10px;border-radius:999px;
}
.msg-lightbox__close{
  position:absolute;z-index:2;top:max(10px, env(safe-area-inset-top));
  right:max(10px, env(safe-area-inset-right));
  width:44px;height:44px;border-radius:999px;border:1px solid rgba(148,163,184,.35);
  background:rgba(15,23,42,.8);color:#fff;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.msg-lightbox__close::before{content:"\00D7";font-size:28px;line-height:1;font-weight:400}
.msg-lightbox__close:hover{background:rgba(239,68,68,.35);border-color:rgba(239,68,68,.5)}
.msg-lightbox__download{
  position:absolute;z-index:2;top:max(10px, env(safe-area-inset-top));
  right:calc(max(10px, env(safe-area-inset-right)) + 52px);
  width:44px;height:44px;border-radius:999px;border:1px solid rgba(148,163,184,.35);
  background:rgba(15,23,42,.8);color:#fff;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.msg-lightbox__download::before{content:"\2193";font-size:22px;line-height:1;font-weight:700}
.msg-lightbox__download:hover{background:rgba(16,185,129,.35);border-color:rgba(16,185,129,.5)}
.msg-lightbox__nav{
  position:absolute;z-index:2;top:50%;transform:translateY(-50%);
  width:44px;height:44px;border-radius:999px;border:1px solid rgba(148,163,184,.35);
  background:rgba(15,23,42,.75);color:#fff;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.msg-lightbox__nav--prev{left:max(8px, env(safe-area-inset-left))}
.msg-lightbox__nav--next{right:max(8px, env(safe-area-inset-right))}
.msg-lightbox__nav--prev::before{content:"\2039";font-size:28px;line-height:1}
.msg-lightbox__nav--next::before{content:"\203A";font-size:28px;line-height:1}
.msg-lightbox__nav:hover{background:rgba(16,185,129,.28);border-color:rgba(16,185,129,.45)}
@media (max-width:720px){
  .msg-lightbox__nav{width:40px;height:40px}
  .msg-lightbox__img{max-height:min(78dvh,900px)}
}
.msg-wa-tpl{display:flex;flex-wrap:wrap;gap:8px;width:100%;align-items:flex-end}
.msg-search{display:flex;gap:6px;align-items:center;margin-bottom:8px}
.msg-search input[type="search"]{flex:1;min-width:0}
.msg-search--pill{
  gap:0;margin:0;padding:0 12px;min-height:42px;
  border-radius:999px;border:0;
  background:var(--surface-inset);
  box-shadow:inset 0 0 0 1px var(--line);
  align-items:center;
}
.msg-search--pill .msg-search__icon{
  flex:0 0 auto;width:22px;height:22px;margin-right:8px;position:relative;opacity:.55;
}
.msg-search--pill .msg-search__icon::before{
  content:"";position:absolute;left:3px;top:3px;width:10px;height:10px;
  border:2px solid currentColor;border-radius:50%;color:var(--muted);
}
.msg-search--pill .msg-search__icon::after{
  content:"";position:absolute;right:2px;bottom:2px;width:7px;height:2px;
  background:currentColor;color:var(--muted);border-radius:1px;
  transform:rotate(45deg);transform-origin:left center;
}
.msg-search--pill input[type="search"]{
  flex:1;min-width:0;border:0 !important;background:transparent !important;
  box-shadow:none !important;padding:10px 0;font-size:15px;outline:none;
}
.msg-search--pill input[type="search"]::-webkit-search-decoration,
.msg-search--pill input[type="search"]::-webkit-search-cancel-button{display:none}
.msg-search--pill .msg-search__clear{
  flex:0 0 auto;width:28px;height:28px;margin-left:4px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;text-decoration:none;color:var(--muted);font-size:18px;line-height:1;
}
.msg-search--pill .msg-search__clear:hover{color:var(--text);background:rgba(148,163,184,.12)}
.msg-search-hint{
  margin:6px 2px 0;font-size:12px;line-height:1.35;color:var(--muted,#94a3b8)
}
.msg-conv-phone{
  font-size:12px;line-height:1.3;color:var(--muted,#94a3b8);margin:1px 0 2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
html[data-theme="light"] .msg-search--pill{
  background:rgba(148,163,184,.16);
  box-shadow:none;
}
.msg-new-hint{display:block;margin-bottom:8px;text-align:center}
.nav-msg-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:20px;height:20px;padding:0 6px;margin:0;
  font-size:11px;font-weight:700;line-height:1;color:#fff;
  background:var(--danger);
  border-radius:999px;vertical-align:middle;
  box-shadow:none;
}
.nav-msg-badge[hidden],.nav-msg-badge[data-count="0"]{display:none !important}
.nav-msg-badge--top{position:absolute;top:2px;right:2px;margin:0;z-index:1}
.msg-top-wrap{display:inline-flex;align-items:center;gap:4px;position:relative}
.msg-top-chats{position:relative;padding:8px 12px;min-width:44px}
.msg-sound-mute{padding:8px 10px;min-width:40px;opacity:.9}
.msg-sound-mute.is-muted{opacity:.55}
.msg-conv-unread{flex-shrink:0}
.msg-conv-preview-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-ig-window{margin-top:6px;padding:6px 8px;border-radius:8px}
.msg-ig-window--ok{background:rgba(16,185,129,.12);color:var(--text)}
.msg-ig-window--warn{background:rgba(245,158,11,.15);color:var(--text)}
.msg-oc-services{display:flex;flex-direction:column;gap:6px;max-height:180px;overflow:auto;padding:4px 0;-webkit-overflow-scrolling:touch}
.msg-oc-svc{display:flex;gap:8px;align-items:flex-start;padding:6px 8px;border:1px solid var(--line);border-radius:10px;cursor:pointer;font-size:13px}
.msg-oc-svc input{width:auto;margin-top:2px;flex-shrink:0}
.msg-oc-dialog{max-width:640px;width:calc(100% - 24px);max-height:min(92vh,920px);display:flex;flex-direction:column;padding:0;overflow:hidden}
.msg-oc-dialog > .card-h{flex:0 0 auto}
.msg-oc-dialog > .msg-oc-body{
  flex:1 1 auto;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;
}
.msg-oc-body{
  max-height:none;
}
.msg-oc-footer{
  flex:0 0 auto;
  display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;align-items:center;
  margin:0;padding:12px 16px;
  border-top:1px solid var(--line);
  background:var(--panel);
  z-index:2;
}
.msg-oc-dialog .order-amount-split-row{grid-template-columns:1fr;gap:8px}
@media (min-width:720px){
  .msg-oc-dialog .order-amount-split-row{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.msg-order-chip{font-weight:700;white-space:nowrap;border-radius:999px;padding:6px 12px}
.msg-send-btn:not(:disabled){min-width:42px}
.msg-composer .msg-send-btn{border-radius:999px}
.msg-toast{
  position:fixed;right:16px;bottom:16px;z-index:1200;max-width:min(360px,92vw);
  padding:12px 14px;border-radius:12px;background:var(--panel);border:1px solid var(--line);
  box-shadow:var(--shadow);display:none;
}
.msg-toast.is-show{display:block;animation:msg-toast-in .2s ease}
.msg-toast-title{font-weight:700;font-size:13px;margin-bottom:4px}
.msg-toast-body{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-toast-link{display:inline-block;margin-top:8px;font-size:12px;font-weight:700}
@keyframes msg-toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.msg-channel-select-wrap{display:none !important}
.msg-back-list{display:none;flex-shrink:0;margin:0}
@media (max-width:900px){
  .msg-inbox{grid-template-columns:minmax(0,280px) minmax(0,1fr)}
}
@media (max-width:720px){
  .crm-section-tabs--msg{display:none !important}
  .main:not(.main--guest-login){
    overflow-x:hidden;
    max-width:100%;
  }
  .main:not(.main--guest-login):has(#msg-inbox){
    padding-left:0;
    padding-right:0;
    padding-bottom:0;
  }
  .main:not(.main--guest-login):has(#msg-inbox) > .main-body{
    padding-left:0 !important;
    padding-right:0 !important;
    padding-bottom:0 !important;
    /* Список диалогов: только main-body под fixed topbar (без двойного pad на .main) */
    padding-top:var(--shell-topbar-offset, 56px) !important;
    gap:0 !important;
  }
  .main:not(.main--guest-login):has(#msg-inbox){
    padding-top:0;
  }
  .main:not(.main--guest-login):has(#msg-inbox) .crm-section-tabs{
    display:none !important;
  }
  .msg-inbox{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto minmax(0,1fr);
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:0;
    height:auto;
    flex:1 1 auto;
    gap:0;
  }
  .msg-inbox > *{
    min-width:0;
    max-width:100%;
  }
  .msg-channel-bar{
    grid-column:1;
    grid-row:1;
    width:100%;
    max-width:100%;
    overflow:visible;
    box-sizing:border-box;
    border-radius:0;
    border-left:0;
    border-right:0;
    margin:0;
    padding:6px 8px 4px;
  }
  .msg-channel-toolbar{display:none !important}
  .msg-channel-logos{
    flex:1 1 auto;
    width:100%;
    max-width:100%;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    padding:4px 2px 4px;
    margin:0;
    gap:6px;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    touch-action:pan-x;
    scrollbar-width:none;
    scroll-padding-inline:6px;
  }
  .msg-channel-logos::-webkit-scrollbar{
    display:none;
    height:0;
    width:0;
  }
  .msg-channel-logo{
    flex:0 0 auto;
    padding:3px;
    border-radius:9px;
  }
  .msg-channel-badge{
    width:24px;
    height:24px;
    min-width:24px;
    border-radius:7px;
  }
  .msg-channel-badge svg{width:24px;height:24px}
  .msg-channel-badge--all .msg-channel-badge-mark{font-size:8px}
  .msg-channel-badge--settings{min-width:24px}
  .msg-channel-badge--settings::before{font-size:12px}
  .msg-channel-logo svg{width:18px;height:18px}
  .msg-channel-bar-inner{
    flex-wrap:nowrap;
    overflow:visible;
    align-items:center;
  }
  .msg-unread-bar{
    width:100%;
    max-width:100%;
    padding:2px 12px 6px;
    border-top:0;
    border-bottom:1px solid var(--line);
  }
  .msg-unread-switch{min-height:24px;gap:7px}
  .msg-unread-switch__text{font-size:12.5px;font-weight:400}
  .msg-unread-switch__icon{width:15px;height:15px}
  .msg-unread-switch__track{width:32px;height:18px}
  .msg-unread-switch__knob{width:14px;height:14px;top:2px;left:2px}
  .msg-unread-switch.is-on .msg-unread-switch__knob{transform:translateX(14px)}
  .msg-deal-filter-btn{width:30px;height:30px;border-radius:9px}
  .msg-list{
    grid-column:1;
    grid-row:2;
  }
  .msg-chat{
    grid-column:1;
    grid-row:3;
  }
  body.body--msg-tools-bar .msg-tools-gear--top{
    display:inline-flex !important;
  }
  body.body--msg-tools-bar .topbar-heading{
    flex:1 1 auto;
    width:100%;
    max-width:100%;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:4px;
  }
  body.body--msg-tools-bar .topbar-center-title{
    display:inline-flex;
    font-size:14.5px;
  }
  .msg-list-tools{padding:8px 12px 6px}
  .msg-inbox.is-chat-open .msg-thread{
    padding:10px 12px 14px;
  }
  .msg-inbox.is-chat-open .msg-row{
    max-width:100%;
  }
  body.body--msg-tools-bar .msg-tools-portal{
    position:fixed;
    inset:0;
    width:auto;
    height:auto;
    z-index:1350;
    pointer-events:none;
    overflow:visible;
  }
  body.body--msg-tools-bar .msg-tools-portal.is-open{
    pointer-events:auto;
    background:rgba(2,6,23,.45);
  }
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel{
    position:absolute;
    top:max(64px, calc(var(--shell-topbar-offset, 56px) + 8px));
    right:max(10px, env(safe-area-inset-right));
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    min-width:200px;
    padding:12px;
    border-radius:14px;
    border:1px solid var(--line);
    background:var(--panel);
    box-shadow:var(--shadow);
    pointer-events:auto;
  }
  body.body--msg-tools-bar .msg-tools-portal.is-open .msg-tools-panel{
    display:flex;
  }
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel .theme-switch,
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel .msg-top-wrap,
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel .notifications-wrap,
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel .topbar-actions{
    width:100%;
    justify-content:flex-start;
  }
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel .btn,
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel .theme-switch__btn{
    width:100%;
    justify-content:center;
  }
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel .msg-top-wrap{
    display:flex;
    gap:6px;
  }
  body.body--msg-tools-bar .msg-tools-portal .msg-tools-panel .msg-top-wrap .btn{
    flex:1;
  }
  .msg-list,
  .msg-chat.card{
    border-radius:0;
    border-left:0;
    border-right:0;
  }
  .msg-list{
    grid-column:1;
    grid-row:2;
    max-height:none;
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
  }
  .msg-list > .msg-conv-scroll,
  .msg-list > [data-scrollbar="cropped"]:has(.msg-conv-scroll){
    overflow-x:hidden;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .msg-chat{
    grid-column:1;
    grid-row:3;
    width:100%;
    max-width:100%;
    min-width:0;
  }
  /* Мобильная шапка (~360px):
     строка 1: ← | статус | Заказ ▾ | непрочит.
     ниже: имя + ● / канал — на всю ширину */
  .msg-chat-head-main{
    display:grid;
    grid-template-columns:max-content max-content max-content 1fr max-content;
    grid-template-areas:
      "back status order . unread"
      "name name name name name"
      "sub sub sub sub sub";
    align-items:center;
    column-gap:4px;
    row-gap:4px;
    min-width:0;
    width:100%;
  }
  .msg-chat-peer,
  .msg-chat-peer-row,
  .msg-chat-peer-tools,
  #msg-peer-actions,
  .msg-chat-peer-actions{display:contents}
  .msg-back-list{
    grid-area:back;
    display:inline-flex;
    align-self:center;
    justify-self:start;
    padding:4px 8px;
    font-size:11px;
    line-height:1.2;
    min-height:0;
    height:auto;
    border-radius:10px;
    gap:0;
    flex:0 0 auto;
    width:max-content;
    max-width:none;
    min-width:34px;
    white-space:nowrap;
  }
  .msg-deal-select{
    grid-area:status;
    width:auto;
    max-width:min(112px,32vw);
    min-width:0;
    justify-self:start;
    margin-left:0;
  }
  #msg-order-manage-dd{
    grid-area:order;
    justify-self:start;
    width:auto;
    max-width:100%;
    min-width:0;
  }
  .msg-mark-unread-btn{
    grid-area:unread;
    justify-self:end;
    align-self:center;
    width:29px;
    height:29px;
    min-height:29px;
    max-height:29px;
  }
  .msg-order-manage-toggle.btn,
  .msg-order-manage-toggle{
    width:auto;
    max-width:100%;
    min-width:0;
    height:29px;
    min-height:29px;
    max-height:29px;
    padding:0 10px;
    font-size:12.5px;
    font-weight:700;
    border-radius:999px;
    justify-content:center;
  }
  /* display:contents на peer-row — имя + ● в .msg-chat-peer-identity */
  .msg-chat-peer-identity{
    grid-area:name;
    min-width:0;
    align-self:start;
    justify-self:stretch;
    width:100%;
    max-width:100%;
  }
  .msg-peer-presence-label{
    max-width:min(100%, 12rem);
  }
  .msg-chat-peer-sub{
    grid-area:sub;
    justify-self:start;
    align-self:start;
    min-width:0;
    max-width:100%;
  }
  .msg-chat-head-main .msg-chat-peer-item,
  .msg-chat-head-main .msg-ig-window{
    grid-column:1 / -1;
    justify-self:stretch;
    min-width:0;
  }
  .msg-chat-peer-tools > .visually-hidden{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
  }
  .msg-chat-head-main .msg-btn-full{display:none}
  .msg-chat-head-main .msg-btn-short{display:inline}
  .msg-inbox.is-chat-open .msg-chat-head{
    margin-top:0;
    border-top:0;
  }
  .msg-inbox:not(.is-chat-open) > .msg-chat{display:none !important}
  .msg-inbox.is-chat-open > .msg-list{display:none !important}
  .msg-inbox.is-chat-open > .msg-channel-bar{display:none !important}
  /* Высота = visualViewport; offset ТОЛЬКО на .main — main-body без повторного pad */
  .main:not(.main--guest-login):has(#msg-inbox.is-chat-open){
    height:100dvh;
    max-height:100dvh;
    min-height:0; /* иначе .main{min-height:100vh} тянет layout ниже клавиатуры */
    margin-top:0;
    padding-top:var(--shell-topbar-offset, 49px);
  }
  .main:not(.main--guest-login):has(#msg-inbox.is-chat-open) > .main-body{
    padding-top:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    padding-bottom:0 !important;
    gap:0 !important;
    margin:0 !important;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }
  /* Клавиатура: main ровно в visualViewport; min-height:100vh сбрасываем */
  html.msg-kb-open .main:not(.main--guest-login):has(#msg-inbox.is-chat-open){
    position:fixed;
    top:var(--msg-vv-top, 0px);
    left:0;
    right:0;
    width:100%;
    height:var(--msg-vv-height, 100dvh) !important;
    max-height:var(--msg-vv-height, 100dvh) !important;
    min-height:0 !important;
    padding-top:var(--shell-topbar-offset, 49px);
    padding-bottom:0 !important;
    margin:0 !important;
    z-index:20;
    overflow:hidden;
    box-sizing:border-box;
  }
  html.msg-kb-open .main:not(.main--guest-login):has(#msg-inbox.is-chat-open) > .main-body,
  html.msg-kb-open .msg-inbox.is-chat-open,
  html.msg-kb-open .msg-inbox.is-chat-open > .msg-chat,
  html.msg-kb-open .msg-inbox.is-chat-open .msg-chat-main{
    height:100%;
    max-height:100%;
    min-height:0;
  }
  html.msg-kb-open .msg-composer{
    padding-bottom:8px;
    flex:0 0 auto;
    position:relative;
    z-index:30;
  }
  .msg-inbox.is-chat-open{
    height:100%;
    max-height:100%;
    min-height:0;
  }
  .msg-inbox.is-chat-open > .msg-chat{
    min-height:0;
    height:100%;
    max-height:100%;
    display:flex;
    flex-direction:column;
    border-top:0;
    margin-top:0;
  }
  .msg-inbox.is-chat-open .msg-chat-main{
    height:100%;
    max-height:100%;
    min-height:0;
  }
  .msg-inbox.is-chat-open .msg-chat-head{
    flex:0 0 auto;
    position:relative;
    z-index:40;
    overflow:visible;
    padding:6px 10px 8px;
    margin:0;
    border-radius:0;
    border-left:0;
    border-right:0;
    border-top:0;
    background:var(--card-bg);
  }
  .msg-inbox.is-chat-open .msg-chat-head-main{
    row-gap:2px;
    column-gap:6px;
  }
  .msg-inbox.is-chat-open .msg-chat-peer h3,
  .msg-inbox.is-chat-open .msg-peer-name-link{
    font-size:15px;
    line-height:1.25;
    margin:0;
  }
  .msg-inbox.is-chat-open .msg-chat-peer-sub{
    font-size:11px;
    line-height:1.3;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    max-width:100%;
  }
  .msg-inbox.is-chat-open .msg-thread,
  .msg-inbox.is-chat-open [data-scrollbar="cropped"]:has(.msg-thread),
  .msg-inbox.is-chat-open .msg-history-stack{min-height:0;flex:1 1 auto}
  .msg-hop-btn{
    width:32px;
    height:32px;
    right:10px;
    bottom:8px;
  }
  .msg-hop-btn__icon{width:16px;height:16px}
  .msg-hop-btn__icon::before{
    width:8px;height:8px;margin-left:-4px;margin-top:-5px;border-width:2px;
  }
  .msg-hop-btn__badge{
    min-width:16px;height:16px;line-height:16px;font-size:10px;padding:0 4px;top:-3px;right:-3px;
  }
  .msg-composer{
    padding:0 8px max(8px, env(safe-area-inset-bottom, 0px));
    flex:0 0 auto;
    position:relative;
    z-index:25;
    background:transparent;
    transform:translateZ(0);
  }
  html[data-theme="light"] .msg-composer{
    background:transparent;
  }
  .msg-composer-bar{min-height:44px}
  .msg-composer textarea{min-height:36px;max-width:100%;font-size:16px}
  .msg-composer-row{min-width:0;max-width:100%}
  .msg-emoji-panel{
    max-height:min(40vh, 240px);
    grid-template-columns:repeat(7,minmax(0,1fr));
    left:8px;right:8px;
  }
  .msg-comp-icon#msg-emoji-btn{touch-action:manipulation}
  .msg-comp-icon,
  .msg-send-btn.msg-comp-icon{width:36px;min-width:36px;height:36px;padding:0}
  .msg-send-btn--wa{width:auto;min-width:42px;padding:0 14px;border-radius:999px}
  .msg-bubble{max-width:min(88%,100%)}
  .msg-search{min-width:0;max-width:100%}
}

/* ——— A2HS: «Как включить уведомления» (стиль VK, bottom sheet) ——— */
.a2hs-sheet{
  position:fixed;inset:0;z-index:2400;
  display:flex;align-items:flex-end;justify-content:center;
  pointer-events:none;
}
.a2hs-sheet[hidden]{display:none !important}
.a2hs-sheet.is-open{pointer-events:auto}
.a2hs-sheet__backdrop{
  position:absolute;inset:0;
  background:rgba(0,0,0,.55);
  opacity:0;transition:opacity .22s ease;
}
.a2hs-sheet.is-open .a2hs-sheet__backdrop{opacity:1}
.a2hs-sheet__panel{
  position:relative;z-index:1;
  width:100%;max-width:440px;
  margin:0 auto;
  padding:10px 20px calc(18px + env(safe-area-inset-bottom,0px));
  border-radius:20px 20px 0 0;
  background:#232324;
  color:#fff;
  box-shadow:0 -8px 40px rgba(0,0,0,.45);
  transform:translateY(110%);
  transition:transform .28s cubic-bezier(.22,1,.36,1);
}
.a2hs-sheet.is-open .a2hs-sheet__panel{transform:translateY(0)}
.a2hs-sheet__handle{
  width:36px;height:4px;border-radius:999px;
  background:rgba(255,255,255,.22);
  margin:2px auto 14px;
}
.a2hs-sheet__hero{display:flex;justify-content:center;margin:4px 0 10px}
.a2hs-sheet__bell{display:block;line-height:0;filter:drop-shadow(0 6px 14px rgba(38,136,235,.35))}
.a2hs-sheet__lead{
  margin:0 0 14px;padding:0 4px;font-size:13px;line-height:1.45;color:rgba(255,255,255,.72);text-align:center;font-weight:500
}
.a2hs-sheet__lead[hidden]{display:none !important}
.a2hs-sheet__title{
  margin:0 0 18px;text-align:center;
  font-size:20px;font-weight:700;line-height:1.25;letter-spacing:-.01em;
  color:#fff;
}
.a2hs-sheet__steps{
  list-style:none;margin:0;padding:0 2px 8px;
  display:flex;flex-direction:column;gap:16px;
}
.a2hs-sheet__steps[hidden]{display:none !important}
.a2hs-sheet__step{
  display:flex;align-items:flex-start;gap:14px;
}
.a2hs-sheet__ico{
  flex:none;width:40px;height:40px;
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.18);
  border-radius:10px;color:rgba(255,255,255,.92);
  background:rgba(255,255,255,.04);
}
.a2hs-sheet__ico--app{
  border:0;background:linear-gradient(160deg,#10b981 0%,#059669 100%);
  color:#fff;font-weight:800;
}
.a2hs-sheet__appmark{font-size:13px;letter-spacing:.02em}
.a2hs-sheet__txt{
  flex:1;min-width:0;padding-top:2px;
  font-size:15px;line-height:1.4;color:rgba(255,255,255,.92);
}
.a2hs-sheet__txt strong{font-weight:700;color:#fff}
.a2hs-sheet__later{
  display:block;width:100%;margin-top:18px;
  padding:14px 16px;border:0;border-radius:14px;
  background:#3a3a3c;color:#fff;
  font-size:16px;font-weight:600;line-height:1.2;
  cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.a2hs-sheet__later:hover,.a2hs-sheet__later:active{background:#454548}
html[data-theme="light"] .a2hs-sheet__panel{
  background:#f4f4f5;color:#111;
  box-shadow:0 -8px 32px rgba(15,23,42,.18);
}
html[data-theme="light"] .a2hs-sheet__handle{background:rgba(15,23,42,.18)}
html[data-theme="light"] .a2hs-sheet__lead{color:#4b5563}
html[data-theme="light"] .a2hs-sheet__title{color:#111}
html[data-theme="light"] .a2hs-sheet__ico{
  border-color:rgba(15,23,42,.14);color:#1f2937;background:#fff;
}
html[data-theme="light"] .a2hs-sheet__txt{color:#1f2937}
html[data-theme="light"] .a2hs-sheet__txt strong{color:#303238}
html[data-theme="light"] .a2hs-sheet__later{background:#e4e4e7;color:#111}
html[data-theme="light"] .a2hs-sheet__later:hover,
html[data-theme="light"] .a2hs-sheet__later:active{background:#d4d4d8}

@media (min-width:901px){
  .a2hs-sheet{display:none !important}
}

.msg-infinite-sentinel{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 10px;
  color:var(--muted);
  font-size:12px;
  flex:0 0 auto;
}
.msg-infinite-sentinel[hidden]{display:none !important}
/* Есть ещё страницы, но сейчас не грузим — невидимый триггер для IntersectionObserver */
.msg-infinite-sentinel:not(.is-loading){
  height:4px;
  padding:0;
  margin:0;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
}
.msg-infinite-sentinel:not(.is-loading) .msg-infinite-spinner,
.msg-infinite-sentinel:not(.is-loading) .msg-infinite-label{
  display:none !important;
}
.msg-infinite-sentinel.is-loading{
  height:auto;
  padding:12px 10px;
  opacity:1;
}
.msg-infinite-spinner{
  width:14px;height:14px;
  border:2px solid rgba(148,163,184,.35);
  border-top-color:var(--brand,#10b981);
  border-radius:50%;
  animation:msg-sbar-spin .7s linear infinite;
}
@keyframes msg-sbar-spin{to{transform:rotate(360deg)}}
.msg-infinite-label{line-height:1.2}
.msg-infinite-sentinel--msgs{
  position:sticky;
  top:28px;
  z-index:5;
  background:transparent;
  pointer-events:none;
}
.msg-infinite-sentinel--msgs:not(.is-loading){
  position:relative;
  top:auto;
}
[data-scrollbar="cropped"]{
  position:relative;
  min-width:0;
  min-height:0;
}
[data-scrollbar="cropped"].crm-sbar-cropped--flex{
  display:flex;
  flex-direction:column;
  align-self:stretch;
}
[data-scrollbar="scrollable"]{
  scrollbar-width:none;
  -ms-overflow-style:none;
}
[data-scrollbar="scrollable"]::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}
[data-scrollbar="cropped"] > [data-scrollbar="scrollable"]{
  flex:1 1 0%;
  min-height:0;
  min-width:0;
  width:100%;
  max-width:100%;
  height:auto;
  max-height:none;
}
/* max-height-host без flex: % от height родителя; иначе clip без скролла (см. .msg-ai-draft__body → data-crm-sbar=off) */
[data-scrollbar="cropped"]:not(.crm-sbar-cropped--flex)[style*="max-height"] > [data-scrollbar="scrollable"]{
  flex:none;
  max-height:100%;
  height:100%;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.sbarTrack.sbarTrackY{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:11px;
  z-index:8;
  pointer-events:none;
  box-sizing:border-box;
}
.sbarThumb.sbarThumbY{
  position:absolute;
  top:0;
  left:0;
  width:11px;
  height:40px;
  pointer-events:auto;
  cursor:default;
  touch-action:none;
  will-change:transform;
  transform:translate3d(0,0,0);
}
.sbarThumb.sbarThumbY::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:6px;
  margin-left:-3px;
  border-radius:3px;
  background:var(--crm-sbar-thumb, #AEB7C2);
  opacity:0;
  transition:opacity .2s ease-out 1s;
  pointer-events:none;
}
[data-scrollbar="cropped"]:hover .sbarThumb.sbarThumbY::before,
.sbarThumb.sbarThumbY.sbarThumb--scrolling::before,
.sbarThumb.sbarThumbY.sbarThumb--dragging::before{
  opacity:.5;
  transition:opacity .2s ease-out 0s;
}
/* Горизонтальный ползунок (таблицы заказов и т.п.) */
.sbarTrack.sbarTrackX{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:11px;
  z-index:8;
  pointer-events:none;
  box-sizing:border-box;
}
.crm-sbar-cropped--has-y .sbarTrack.sbarTrackX{right:11px}
.crm-sbar-cropped--has-x .sbarTrack.sbarTrackY{bottom:11px}
.sbarThumb.sbarThumbX{
  position:absolute;
  top:0;
  left:0;
  height:11px;
  width:40px;
  pointer-events:auto;
  cursor:default;
  touch-action:none;
  will-change:transform;
  transform:translate3d(0,0,0);
}
.sbarThumb.sbarThumbX::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:6px;
  margin-top:-3px;
  border-radius:3px;
  background:var(--crm-sbar-thumb, #AEB7C2);
  opacity:0;
  transition:opacity .2s ease-out 1s;
  pointer-events:none;
}
[data-scrollbar="cropped"]:hover .sbarThumb.sbarThumbX::before,
.sbarThumb.sbarThumbX.sbarThumb--scrolling::before,
.sbarThumb.sbarThumbX.sbarThumb--dragging::before{
  opacity:.5;
  transition:opacity .2s ease-out 0s;
}
/* Таблицы и шаблоны чата: ползунок сразу виден (иначе кажется, что скролла нет) */
.crm-sbar-cropped--table.crm-sbar-cropped--has-x .sbarThumbX::before,
.crm-sbar-cropped--table.crm-sbar-cropped--has-y .sbarThumbY::before,
.msg-tpl-panel [data-scrollbar="cropped"].crm-sbar-cropped--has-y .sbarThumbY::before,
.msg-tpl-panel [data-scrollbar="cropped"].crm-sbar-cropped--has-x .sbarThumbX::before{
  opacity:.45;
  transition:opacity .15s ease-out 0s;
}
.crm-sbar-cropped--table.crm-sbar-cropped--has-x:hover .sbarThumbX::before,
.crm-sbar-cropped--table.crm-sbar-cropped--has-y:hover .sbarThumbY::before,
.crm-sbar-cropped--table .sbarThumbX.sbarThumb--scrolling::before,
.crm-sbar-cropped--table .sbarThumbY.sbarThumb--scrolling::before,
.crm-sbar-cropped--table .sbarThumbX.sbarThumb--dragging::before,
.crm-sbar-cropped--table .sbarThumbY.sbarThumb--dragging::before,
.msg-tpl-panel [data-scrollbar="cropped"]:hover .sbarThumbY::before,
.msg-tpl-panel [data-scrollbar="cropped"]:hover .sbarThumbX::before,
.msg-tpl-panel .sbarThumbY.sbarThumb--scrolling::before,
.msg-tpl-panel .sbarThumbX.sbarThumb--scrolling::before,
.msg-tpl-panel .sbarThumbY.sbarThumb--dragging::before,
.msg-tpl-panel .sbarThumbX.sbarThumb--dragging::before{
  opacity:.7;
}
html[data-theme="dark"]{
  --crm-sbar-thumb:#8B98A8;
}
html[data-theme="light"]{
  --crm-sbar-thumb:#AEB7C2;
}
/* Известные flex-хосты после wrap — тот же паттерн, что у списка диалогов */
.msg-list > [data-scrollbar="cropped"],
.msg-chat-main > [data-scrollbar="cropped"],
.msg-history-stack > [data-scrollbar="cropped"],
.msg-chat > [data-scrollbar="cropped"]{
  flex:1 1 0%;
  min-height:0;
  height:auto;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.sidebar .nav[data-scrollbar="scrollable"]{
  flex:1 1 0%;
  min-height:0;
  height:auto;
  max-height:none;
}
.sidebar > [data-scrollbar="cropped"],
.sidebar [data-scrollbar="cropped"].crm-sbar-cropped--flex{
  flex:1 1 0%;
  min-height:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-self:stretch;
}
.table-wrap[data-scrollbar="scrollable"]{
  /* border остаётся на table-wrap; native scrollbar скрыт — видны кастомные Y/X */
}
/* B.16: градиенты «есть ещё колонки» на host горизонтального скролла */
[data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--has-x{
  position:relative;
}
[data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--has-x::before,
[data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--has-x::after{
  content:"";
  position:absolute;
  top:0;
  bottom:14px;
  width:18px;
  z-index:4;
  pointer-events:none;
  opacity:0;
  transition:opacity .15s ease;
}
[data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--has-x::before{
  left:0;
  background:linear-gradient(90deg, rgba(11,13,18,.55), transparent);
}
[data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--has-x::after{
  right:0;
  background:linear-gradient(270deg, rgba(11,13,18,.55), transparent);
}
[data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--more-left::before{opacity:1}
[data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--more-right::after{opacity:1}
html[data-theme="light"] [data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--has-x::before{
  background:linear-gradient(90deg, rgba(255,255,255,.92), transparent);
}
html[data-theme="light"] [data-scrollbar="cropped"].crm-sbar-cropped--table.crm-sbar-cropped--has-x::after{
  background:linear-gradient(270deg, rgba(255,255,255,.92), transparent);
}
.crm-sbar-cropped--has-y > [data-scrollbar="scrollable"]{
  padding-right:14px;
  box-sizing:border-box;
}
.crm-sbar-cropped--has-x > [data-scrollbar="scrollable"]{
  padding-bottom:14px;
  box-sizing:border-box;
}
[data-scrollbar="cropped"].crm-sbar-cropped--table{
  border-radius:var(--radius);
  overflow:hidden;
  max-width:100%;
}
/* Панель шаблонов: host мог создаться при display:none без flex — фиксируем */
.msg-tpl-panel > [data-scrollbar="cropped"]{
  flex:1 1 0% !important;
  min-height:0 !important;
  min-width:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  align-self:stretch;
}
.msg-tpl-panel > [data-scrollbar="cropped"] > [data-scrollbar="scrollable"]{
  flex:1 1 0% !important;
  min-height:0 !important;
  max-height:none !important;
}

/* ——— Черная банана ПРО (копия layout Higgsfield Nano Banana Pro) ——— */
.main:has(.bb-studio){
  display:flex;
  flex-direction:column;
  min-height:0;
  height:100dvh;
  max-height:100dvh;
  padding-bottom:0 !important;
  overflow:hidden;
  box-sizing:border-box;
}
.main:has(.bb-studio) > .topbar{
  flex:0 0 auto;
  margin-bottom:8px;
}
body:has(.bb-studio){
  overflow:hidden;
}
html:has(.bb-studio),
body:has(.bb-studio){
  height:100%;
  max-height:100dvh;
}
.bb-studio{
  --bb-accent:#d1fe17;
  --bb-accent-text:#303238;
  --bb-surface:#16181b;
  --bb-surface-2:#373a40;
  --bb-panel:#303238;
  --bb-panel-elevated:#3b3e44;
  --bb-border:rgba(255,255,255,.1);
  --bb-muted:rgba(255,255,255,.45);
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  position:relative;
  margin:0 -4px 0;
  color:var(--text);
}
.bb-studio__banner{margin:0 12px 8px;flex:0 0 auto}
.bb-studio__feed{
  flex:1 1 auto;
  min-height:0;
  position:relative;
  overflow:auto;
  padding:4px 8px 11.5rem;
  scrollbar-gutter:stable;
}
.bb-studio__feed-tools{
  position:sticky;
  top:0;
  z-index:5;
  display:flex;
  justify-content:flex-end;
  pointer-events:none;
  margin:0 0 8px;
  padding:4px 0 0;
}
.bb-zoom{
  pointer-events:auto;
  display:inline-flex;
  align-items:center;
  gap:10px;
  height:32px;
  padding:0 12px 0 10px;
  border-radius:16px;
  background:var(--bb-panel-elevated, #3b3e44);
  border:1px solid var(--bb-border, rgba(255,255,255,.1));
  box-shadow:0 6px 18px rgba(0,0,0,.28);
}
html[data-theme="light"] .bb-zoom{
  background:#ffffff;
  border-color:var(--line);
}
.bb-zoom__glyph{
  width:14px;height:14px;flex:0 0 auto;
  background:
    linear-gradient(currentColor, currentColor) center/10px 2px no-repeat,
    linear-gradient(currentColor, currentColor) center/2px 10px no-repeat;
  color:var(--muted);
  opacity:.85;
}
.bb-zoom__slider{display:flex;align-items:center;margin:0}
.bb-zoom__range{
  -webkit-appearance:none;
  appearance:none;
  width:144px;
  height:12px;
  margin:0;
  background:transparent;
  cursor:pointer;
}
.bb-zoom__range:focus{outline:none}
.bb-zoom__range::-webkit-slider-runnable-track{
  height:4px;
  border-radius:999px;
  background:color-mix(in srgb, var(--text) 18%, transparent);
}
.bb-zoom__range::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:14px;height:14px;
  margin-top:-5px;
  border-radius:50%;
  background:var(--text);
  border:2px solid var(--bg);
  box-shadow:0 0 0 1px color-mix(in srgb, var(--text) 35%, transparent);
}
.bb-zoom__range::-moz-range-track{
  height:4px;
  border-radius:999px;
  background:color-mix(in srgb, var(--text) 18%, transparent);
  border:0;
}
.bb-zoom__range::-moz-range-thumb{
  width:14px;height:14px;
  border-radius:50%;
  background:var(--text);
  border:2px solid var(--bg);
}
.bb-studio__empty{
  position:absolute;
  inset:0 0 11.5rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:24px;
  text-align:center;
  pointer-events:none;
  color:var(--muted);
}
.bb-studio__empty[hidden]{display:none !important}
.bb-studio__logo{font-size:40px;line-height:1;opacity:.85}
.bb-studio__empty-title{
  font-size:1.2rem;
  font-weight:800;
  color:var(--text);
}
.bb-studio__empty-text{max-width:28rem;margin:0;font-size:.92rem}
.bb-studio__grid{
  --bb-card-min:220px;
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(var(--bb-card-min), 1fr));
  gap:2px;
  align-items:start;
}
.bb-studio__busy{
  position:sticky;
  bottom:12.5rem;
  z-index:4;
  width:max-content;
  max-width:calc(100% - 24px);
  margin:12px auto 0;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 14px;
  border-radius:999px;
  background:color-mix(in srgb, var(--bg) 82%, var(--surface));
  border:1px solid var(--line);
  box-shadow:0 8px 24px rgba(0,0,0,.22);
  font-size:13px;
  font-weight:600;
  color:var(--text);
  pointer-events:none;
}
.bb-studio__busy[hidden]{display:none !important}
.bb-studio__spinner{
  width:18px;height:18px;
  border:2px solid color-mix(in srgb, var(--text) 18%, transparent);
  border-top-color:var(--bb-accent);
  border-radius:50%;
  animation:bb-spin .8s linear infinite;
  flex:0 0 auto;
}
@keyframes bb-spin{to{transform:rotate(360deg)}}

/* Карточка как asset-card Higgsfield: только картинка + оверлей */
.bb-card{
  position:relative;
  border-radius:0;
  overflow:hidden;
  background:var(--surface-inset, #111);
}
.bb-card--skeleton .bb-card__skel{
  position:absolute;
  inset:0;
  background:
    linear-gradient(110deg,
      color-mix(in srgb, var(--text) 6%, transparent) 20%,
      color-mix(in srgb, var(--text) 14%, transparent) 40%,
      color-mix(in srgb, var(--text) 6%, transparent) 60%);
  background-size:200% 100%;
  animation:bb-skel 1.2s ease-in-out infinite;
}
@keyframes bb-skel{
  0%{background-position:120% 0}
  100%{background-position:-40% 0}
}
.bb-card__frame{
  position:relative;
  width:100%;
  aspect-ratio:var(--bb-ar, 3 / 4);
  overflow:hidden;
}
.bb-card__media{
  display:block;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  background:transparent;
  cursor:zoom-in;
  position:absolute;
  inset:0;
}
.bb-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  pointer-events:none;
}
.bb-card__overlay{
  position:absolute;
  top:0;right:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
  padding:10px 10px 0 0;
  pointer-events:none;
  opacity:0;
  transition:opacity .15s ease;
}
.bb-card:hover .bb-card__overlay,
.bb-card:focus-within .bb-card__overlay{opacity:1}
.bb-card__icon-btn{
  pointer-events:auto;
  width:32px;height:32px;
  border:0;
  border-radius:999px;
  background:rgba(20,21,26,.4);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  text-decoration:none;
  flex:0 0 auto;
}
.bb-card__icon-btn:hover{background:rgba(20,21,26,.62)}
.bb-ico{
  width:14px;height:14px;
  display:block;
  background:currentColor;
  mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:center;
  -webkit-mask-size:contain;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
}
.bb-ico--dl{
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M12 3v12'/><path d='m7 10 5 5 5-5'/><path d='M5 21h14'/></svg>");
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M12 3v12'/><path d='m7 10 5 5 5-5'/><path d='M5 21h14'/></svg>");
}
.bb-ico--expand{
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M9 3H3v6'/><path d='M15 3h6v6'/><path d='M9 21H3v-6'/><path d='M21 15v6h-6'/></svg>");
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M9 3H3v6'/><path d='M15 3h6v6'/><path d='M9 21H3v-6'/><path d='M21 15v6h-6'/></svg>");
}
.bb-ico--reuse{
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M21 12a9 9 0 1 1-3-6.7'/><path d='M21 3v6h-6'/></svg>");
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M21 12a9 9 0 1 1-3-6.7'/><path d='M21 3v6h-6'/></svg>");
}

/* Плавающая форма снизу — как #image-form */
.bb-studio__dock-wrap{
  position:absolute;
  left:50%;
  bottom:14px;
  transform:translateX(-50%);
  z-index:30;
  width:min(1116px, calc(100% - 24px));
  pointer-events:none;
}
.bb-studio__form{
  pointer-events:auto;
  display:flex;
  gap:12px;
  align-items:stretch;
  padding:22px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:var(--card-bg);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  box-shadow:var(--shadow);
}
html[data-theme="light"] .bb-studio__form{
  background:#ffffff;
  border-color:var(--line);
  box-shadow:var(--shadow);
}
.bb-studio__form-main{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.bb-studio__prompt-row{
  display:flex;
  gap:12px;
  align-items:flex-start;
  min-width:0;
}
.bb-studio__refs{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:8px;
  flex:0 0 auto;
  max-width:min(280px, 42%);
}
.bb-studio__ref-btn{
  flex:0 0 40px;
  width:40px;height:40px;
  margin-top:0;
  border:1px solid var(--bb-border, rgba(255,255,255,.1));
  border-radius:10px;
  background:var(--bb-surface-2);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  overflow:hidden;
  position:relative;
}
.bb-studio__ref-btn.is-full{opacity:.4;pointer-events:none}
html[data-theme="light"] .bb-studio__ref-btn{
  background:#f1f5f9;
  border-color:var(--line);
}
.bb-studio__ref-icon{
  width:14px;height:14px;
  background:currentColor;
  color:var(--muted);
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'><path d='M12 5v14'/><path d='M5 12h14'/></svg>") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'><path d='M12 5v14'/><path d='M5 12h14'/></svg>") center/contain no-repeat;
}
.bb-studio__ref-list{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
  min-width:0;
}
.bb-studio__ref-chip{
  position:relative;
  width:40px;height:40px;
  border-radius:10px;
  overflow:hidden;
  border:1px solid var(--bb-border, rgba(255,255,255,.1));
  background:#111;
  flex:0 0 auto;
}
.bb-studio__ref-chip img{
  width:100%;height:100%;
  object-fit:cover;display:block;
}
.bb-studio__ref-chip-x{
  position:absolute;top:2px;right:2px;
  width:16px;height:16px;padding:0;border:0;border-radius:999px;
  background:rgba(0,0,0,.72);color:#fff;
  font-size:12px;line-height:1;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
}
.bb-studio__ref-chip-x::before{content:"\00D7"}
.bb-studio__prompt-wrap{
  flex:1 1 auto;min-width:0;
  max-height:12rem; /* ~192px — как Higgsfield (~189px) */
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  align-self:flex-start;
  height:auto !important;
  flex-grow:1 !important;
  flex-shrink:1 !important;
  flex-basis:auto !important;
}
.bb-studio__prompt-wrap[data-crm-sbar="off"]{
  /* CrmScrollbar не должен фиксировать height:100% */
  max-height:12rem;
}
.bb-studio__prompt{
  width:100%;
  min-height:2.75rem;
  max-height:none;
  height:auto;
  resize:none;
  border:0;
  background:transparent;
  color:var(--text);
  padding:2px 0;
  font:inherit;
  font-size:15px;
  line-height:1.45;
  overflow:hidden;
  field-sizing:content;
}
.bb-studio__prompt:focus{outline:none}
.bb-studio__prompt::placeholder{color:var(--muted)}

.bb-studio__toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  min-height:40px;
}
.bb-studio__pill{
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 12px;
  border-radius:12px;
  border:1px solid var(--bb-border);
  background:var(--bb-surface-2);
  color:var(--text);
  font:inherit;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
}
html[data-theme="light"] .bb-studio__pill{
  background:#f1f5f9;
  border-color:var(--line);
}
.bb-studio__pill--model{cursor:pointer}
.bb-studio__pill-ico{
  width:16px;height:16px;
  border-radius:50%;
  background:linear-gradient(135deg,#4285f4,#34a853 55%,#fbbc05);
  color:#fff;
  font-size:9px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.bb-studio__pill-caret{
  width:10px;height:10px;
  opacity:.55;
  background:currentColor;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4'><path d='m6 9 6 6 6-6'/></svg>") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4'><path d='m6 9 6 6 6-6'/></svg>") center/contain no-repeat;
}
.bb-studio__pill-glyph{
  width:14px;height:14px;
  opacity:.75;
  background:currentColor;
  mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:center;
  -webkit-mask-size:contain;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
}
.bb-studio__pill-glyph--ar{
  mask-image:none;
  -webkit-mask-image:none;
  background:transparent;
  position:relative;
  width:16px;height:16px;
}
.bb-studio__pill-glyph--ar::before{
  content:"";
  position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);
  border:1.5px solid currentColor;
  border-radius:2px;
  opacity:.85;
  width:10px;height:10px;
}
.bb-studio__pill-glyph--ar[data-ar="1:1"]::before,
.bb-studio__pill-glyph--ar[data-ar="Auto"]::before{width:10px;height:10px}
.bb-studio__pill-glyph--ar[data-ar="3:4"]::before,
.bb-studio__pill-glyph--ar[data-ar="2:3"]::before,
.bb-studio__pill-glyph--ar[data-ar="4:5"]::before,
.bb-studio__pill-glyph--ar[data-ar="9:16"]::before{width:8px;height:11px}
.bb-studio__pill-glyph--ar[data-ar="4:3"]::before,
.bb-studio__pill-glyph--ar[data-ar="3:2"]::before,
.bb-studio__pill-glyph--ar[data-ar="5:4"]::before,
.bb-studio__pill-glyph--ar[data-ar="16:9"]::before,
.bb-studio__pill-glyph--ar[data-ar="21:9"]::before{width:12px;height:8px}
.bb-studio__pill-glyph--ar[data-ar="21:9"]::before{width:14px;height:6px}
.bb-studio__pill-glyph--size{
  width:16px;height:16px;
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='black'><path d='M9.783 0.5c.54 0 .894-.003 1.232.079a2.7 2.7 0 0 1 .43.144c.32.137.592.351 1.005.669.707.544 1.267.975 1.677 1.36.415.39.721.772.882 1.24a2.7 2.7 0 0 1 .145 1.19c-.044.492-.253.931-.565 1.398-.308.46-.752.994-1.31 1.668L10.617 11.463c-.502.606-.913 1.105-1.29 1.444-.389.351-.806.593-1.328.593s-.939-.242-1.328-.593c-.377-.339-.788-.838-1.29-1.444L2.719 8.247C2.161 7.573 1.716 7.039 1.408 6.579c-.312-.466-.521-.905-.564-1.397a2.7 2.7 0 0 1 .145-1.19c.161-.467.467-.85.882-1.24.41-.385.97-.816 1.678-1.36.412-.318.684-.532 1.005-.669.138-.06.282-.108.43-.144C5.321.997 5.674 1 6.214 1h3.569zm-3.12 3.667h2.667a.5.5 0 0 1 0 1H6.665a.5.5 0 1 1 0-1z'/></svg>");
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='black'><path d='M9.783 0.5c.54 0 .894-.003 1.232.079a2.7 2.7 0 0 1 .43.144c.32.137.592.351 1.005.669.707.544 1.267.975 1.677 1.36.415.39.721.772.882 1.24a2.7 2.7 0 0 1 .145 1.19c-.044.492-.253.931-.565 1.398-.308.46-.752.994-1.31 1.668L10.617 11.463c-.502.606-.913 1.105-1.29 1.444-.389.351-.806.593-1.328.593s-.939-.242-1.328-.593c-.377-.339-.788-.838-1.29-1.444L2.719 8.247C2.161 7.573 1.716 7.039 1.408 6.579c-.312-.466-.521-.905-.564-1.397a2.7 2.7 0 0 1 .145-1.19c.161-.467.467-.85.882-1.24.41-.385.97-.816 1.678-1.36.412-.318.684-.532 1.005-.669.138-.06.282-.108.43-.144C5.321.997 5.674 1 6.214 1h3.569zm-3.12 3.667h2.667a.5.5 0 0 1 0 1H6.665a.5.5 0 1 1 0-1z'/></svg>");
}
.bb-studio__pill-glyph--draw{
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M12 20h9'/><path d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z'/></svg>");
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M12 20h9'/><path d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z'/></svg>");
}
.bb-studio__count.is-disabled{opacity:.45;pointer-events:none}
.bb-studio__unlimited{
  height:40px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 12px;
  border-radius:12px;
  border:1px solid var(--bb-border);
  background:var(--bb-surface-2);
  cursor:pointer;
  user-select:none;
}
html[data-theme="light"] .bb-studio__unlimited{
  background:#f1f5f9;
  border-color:var(--line);
}
.bb-studio__unlimited input{
  position:absolute;
  width:1px;height:1px;
  opacity:0;
  clip:rect(0,0,0,0);
}
.bb-studio__switch{
  width:34px;height:20px;
  border-radius:999px;
  background:rgba(255,255,255,.18);
  position:relative;
  flex:0 0 auto;
  transition:background .15s ease;
}
.bb-studio__switch::after{
  content:"";
  position:absolute;
  top:2px;left:2px;
  width:16px;height:16px;
  border-radius:50%;
  background:#fff;
  transition:transform .15s ease;
}
.bb-studio__unlimited input:checked + .bb-studio__switch{
  background:var(--bb-accent);
}
.bb-studio__unlimited input:checked + .bb-studio__switch::after{
  transform:translateX(14px);
  background:var(--bb-accent-text);
}
.bb-studio__unlimited-label{
  font-size:13px;
  font-weight:650;
  color:var(--bb-accent);
}
html[data-theme="light"] .bb-studio__unlimited-label{color:var(--text)}
.bb-studio__pill--draw{gap:6px}

/* ——— Draw to Edit (Higgsfield image-inpaint parity) ——— */
.bb-draw{
  position:fixed;inset:0;z-index:1400;
  background:rgba(0,0,0,.78);
  display:flex;align-items:center;justify-content:center;
  padding:12px;
}
.bb-draw[hidden]{display:none !important}
.bb-draw__shell{
  position:relative;
  width:min(1200px, 96vw);
  height:min(900px, 96vh);
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:14px 14px 12px;
  border-radius:20px;
  background:#303238;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 24px 64px rgba(0,0,0,.55);
  color:#fff;
}
.bb-draw__close{
  position:absolute;top:12px;right:12px;z-index:3;
  width:36px;height:36px;border:0;border-radius:10px;
  background:rgba(255,255,255,.08);cursor:pointer;
}
.bb-draw__close::before{content:"\00D7";font-size:22px;line-height:1;color:#fff}
.bb-draw__modes{
  align-self:center;
  display:inline-flex;
  gap:4px;
  padding:4px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  outline:1px solid rgba(255,255,255,.08);
}
.bb-draw__mode{
  display:inline-flex;align-items:center;gap:6px;
  height:40px;padding:0 16px;border:0;border-radius:999px;
  background:transparent;color:rgba(255,255,255,.55);
  font:inherit;font-size:13px;font-weight:600;cursor:pointer;
}
.bb-draw__mode.is-active{
  background:rgba(255,255,255,.1);
  color:#fff;
  outline:1px solid rgba(255,255,255,.14);
}
.bb-draw__mode-new{
  font-size:10px;font-weight:800;letter-spacing:.04em;
  padding:2px 6px;border-radius:6px;
  background:var(--bb-accent,#d1fe17);color:#303238;
}
.bb-draw__mode-ico{
  width:16px;height:16px;border-radius:50%;
  border:1.5px solid currentColor;
  background:
    linear-gradient(currentColor,currentColor) 50% 30%/1.5px 7px no-repeat,
    linear-gradient(currentColor,currentColor) 50% 70%/4px 1.5px no-repeat;
}
.bb-draw__stage{
  position:relative;
  flex:1 1 auto;
  min-height:0;
  display:flex;align-items:center;justify-content:center;
  border-radius:16px;
  background:#0b0c0f;
  overflow:hidden;
}
.bb-draw__canvas-wrap{
  position:relative;
  width:min(100%, 72vh);
  aspect-ratio:1 / 1;
  max-height:100%;
}
.bb-draw__layer{
  position:absolute;inset:0;
  width:100%;height:100%;
  display:block;
  border-radius:8px;
}
.bb-draw__layer--overlay{cursor:crosshair;touch-action:none}
.bb-draw__empty{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;padding:24px;text-align:center;
  background:radial-gradient(600px 300px at 50% 40%, rgba(209,254,23,.08), transparent 60%);
}
.bb-draw__empty[hidden]{display:none !important}
.bb-draw__empty-title{margin:0;font-size:18px;font-weight:800;letter-spacing:.06em}
.bb-draw__empty-text{margin:0;max-width:22rem;color:rgba(255,255,255,.55);font-size:13px}
.bb-draw__empty-btn{
  margin-top:8px;height:40px;padding:0 18px;border:0;border-radius:12px;
  background:var(--bb-accent,#d1fe17);color:#303238;font:inherit;font-weight:700;cursor:pointer;
}
.bb-draw__prompt-wrap{flex:0 0 auto}
.bb-draw__prompt{
  width:100%;min-height:44px;max-height:5rem;resize:vertical;
  border:1px solid rgba(255,255,255,.1);border-radius:12px;
  background:rgba(255,255,255,.04);color:#fff;
  padding:10px 12px;font:inherit;font-size:14px;line-height:1.4;
}
.bb-draw__prompt::placeholder{color:rgba(255,255,255,.4)}
.bb-draw__prompt:focus{outline:none;border-color:rgba(209,254,23,.45)}
.bb-draw__bar{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:10px;
  min-height:48px;
}
.bb-draw__bar-left,.bb-draw__bar-right{display:flex;align-items:center;gap:8px}
.bb-draw__bar-right{
  justify-content:flex-end;
  height:48px;padding:4px;border-radius:16px;
  background:rgba(59,62,68,.96);
  border:1px solid rgba(255,255,255,.08);
  width:fit-content;margin-left:auto;
}
.bb-draw__bar-right .bb-draw__util{
  background:transparent;border:0;height:40px;
}
.bb-draw__bar-right .bb-draw__util--icon{width:40px}
.bb-draw__anchor{position:relative;display:inline-flex;align-items:center}
.bb-draw__pop{
  position:absolute;
  left:0;
  bottom:calc(100% + 10px);
  z-index:5;
  min-width:168px;
  padding:10px;
  border-radius:14px;
  background:#373a40;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 12px 36px rgba(0,0,0,.45);
  color:#fff;
}
.bb-draw__pop[hidden]{display:none !important}
.bb-draw__pop--quality{min-width:0;padding:12px}
.bb-draw__pop--model{min-width:260px;padding:8px;display:flex;flex-direction:column;gap:4px}
.bb-draw__pop--aspect{
  left:auto;right:0;min-width:120px;padding:6px;
  display:flex;flex-direction:column;gap:2px;
}
.bb-draw__pop-label{
  margin:0 0 8px;font-size:12px;font-weight:600;
  color:rgba(255,255,255,.45);letter-spacing:.02em;
}
.bb-draw__quality-seg{
  display:inline-flex;padding:3px;gap:2px;border-radius:10px;
  background:rgba(255,255,255,.06);
}
.bb-draw__quality-btn{
  min-width:44px;height:32px;padding:0 12px;border:0;border-radius:8px;
  background:transparent;color:rgba(255,255,255,.7);
  font:inherit;font-size:13px;font-weight:700;cursor:pointer;
}
.bb-draw__quality-btn[aria-checked="true"],
.bb-draw__quality-btn.is-selected{
  background:#fff;color:#111;
}
.bb-draw__pop-opt{
  display:flex;align-items:flex-start;gap:10px;width:100%;
  padding:10px;border:0;border-radius:12px;
  background:transparent;color:#fff;text-align:left;
  font:inherit;cursor:pointer;
}
.bb-draw__pop-opt:hover,.bb-draw__pop-opt.is-selected{background:rgba(255,255,255,.08)}
.bb-draw__pop-opt--compact{
  align-items:center;justify-content:center;
  padding:8px 12px;font-size:13px;font-weight:600;
}
.bb-draw__pop-opt-ico{
  flex:0 0 auto;width:28px;height:28px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:#fff;color:#111;font-size:11px;font-weight:800;
}
.bb-draw__pop-opt-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.bb-draw__pop-opt-title{font-size:13px;font-weight:700}
.bb-draw__pop-opt-desc{font-size:11px;color:rgba(255,255,255,.5);line-height:1.3}
.bb-draw__example{
  position:absolute;top:64px;right:16px;z-index:4;
  width:min(220px, 42vw);
  padding:12px 14px 14px;
  border-radius:14px;
  background:#373a40;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 12px 36px rgba(0,0,0,.4);
  color:#fff;
}
.bb-draw__example[hidden]{display:none !important}
.bb-draw__example-x{
  position:absolute;top:8px;right:8px;
  width:24px;height:24px;border:0;border-radius:8px;
  background:rgba(255,255,255,.08);cursor:pointer;
}
.bb-draw__example-x::before{content:"\00D7";font-size:16px;line-height:1;color:#fff}
.bb-draw__example-title{margin:0 20px 6px 0;font-size:13px;font-weight:700}
.bb-draw__example-text{margin:0;font-size:12px;line-height:1.4;color:rgba(255,255,255,.6)}
.bb-draw__settings{
  width:40px;height:40px;border:0;border-radius:12px;cursor:pointer;
  background:rgba(255,255,255,.06);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><path d='M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1 14h6M9 8h6M17 16h6'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:16px;
}
.bb-draw__settings[aria-expanded="true"]{background-color:rgba(255,255,255,.12)}

.bb-draw__bar-center{
  display:flex;align-items:center;gap:0;
  justify-content:center;
}
.bb-draw__dock{
  display:inline-flex;align-items:center;gap:6px;
  height:48px;padding:4px 6px 4px 4px;border-radius:16px;
  background:rgba(59,62,68,.96);
  border:1px solid rgba(255,255,255,.08);
}
.bb-draw__dock .bb-draw__toolbox{
  height:auto;padding:0;border:0;background:transparent;border-radius:0;
}
.bb-draw__dock .bb-draw__generate{height:40px}
.bb-draw__model{
  display:inline-flex;align-items:center;gap:8px;
  height:40px;padding:0 12px;border:0;border-radius:12px;
  background:rgba(255,255,255,.06);color:#fff;
  font:inherit;font-size:13px;font-weight:600;cursor:pointer;max-width:220px;
}
.bb-draw__model-ico{
  width:18px;height:18px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:#fff;color:#111;font-size:10px;font-weight:800;
}
.bb-draw__model span:nth-child(2){
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:140px;
}
.bb-draw__model-caret{
  width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid rgba(255,255,255,.55);
}
.bb-draw__toolbox{
  display:inline-flex;align-items:center;gap:2px;
  height:42px;padding:4px;border-radius:14px;
  background:rgba(59,62,68,.96);
  border:1px solid rgba(255,255,255,.08);
}
.bb-draw__tool{
  width:32px;height:32px;border:0;border-radius:10px;
  background:transparent center/16px no-repeat;
  cursor:pointer;opacity:.7;
}
.bb-draw__tool.is-active,.bb-draw__tool:hover{background-color:rgba(255,255,255,.12);opacity:1}
.bb-draw__tool:disabled{opacity:.28;cursor:not-allowed}
.bb-draw__tool[data-tool="select"]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M4 3l7 17 2-7 7-2z'/></svg>")}
.bb-draw__tool[data-tool="brush"]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><path d='M4 20l6-1 9-9a2 2 0 0 0-3-3l-9 9-1 6z'/></svg>")}
.bb-draw__tool[data-tool="eraser"]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><path d='M16 3l5 5-9 9H7l-3-3 12-11zM7 17h9'/></svg>")}
.bb-draw__tool[data-tool="rect"]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><rect x='5' y='5' width='14' height='14' rx='1'/></svg>")}
.bb-draw__tool[data-tool="arrow"]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><path d='M5 19L19 5M19 5h-7M19 5v7'/></svg>")}
.bb-draw__tool[data-tool="text"]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M5 5h14v3h-5v11h-4V8H5z'/></svg>")}
.bb-draw__tool[data-tool="image"]{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><rect x='3' y='5' width='18' height='14' rx='2'/><circle cx='9' cy='10' r='1.5'/><path d='M21 16l-5-5-7 7'/></svg>")}
#bb-draw-undo{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><path d='M9 14L4 9l5-5'/><path d='M4 9h9a6 6 0 0 1 0 12h-2'/></svg>")}
#bb-draw-redo{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><path d='M15 14l5-5-5-5'/><path d='M20 9H11a6 6 0 0 0 0 12h2'/></svg>")}
.bb-draw__toolbox-sep{width:1px;height:18px;margin:0 4px;background:rgba(255,255,255,.14)}
.bb-draw__color{
  position:relative;width:32px;height:32px;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
}
.bb-draw__color input{position:absolute;inset:0;opacity:0;cursor:pointer}
.bb-draw__color-dot{
  width:16px;height:16px;border-radius:50%;
  background:#ef4444;border:1px solid rgba(255,255,255,.24);
}
.bb-draw__generate{
  height:40px;padding:0 16px;border:0;border-radius:12px;
  background:var(--bb-accent,#d1fe17);color:#303238;
  font:inherit;font-size:13px;font-weight:800;
  display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  white-space:nowrap;
}
.bb-draw__generate:disabled{opacity:.45;cursor:not-allowed}
.bb-draw__generate-meta{display:inline-flex;align-items:center;gap:3px;opacity:.85}
.bb-draw__generate-spark{
  width:12px;height:12px;background:currentColor;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M12 2l1.2 6.3L19 8l-4.5 3.6L16 18l-4-3.2L8 18l1.5-6.4L5 8l5.8-.7z'/></svg>") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M12 2l1.2 6.3L19 8l-4.5 3.6L16 18l-4-3.2L8 18l1.5-6.4L5 8l5.8-.7z'/></svg>") center/contain no-repeat;
}
.bb-draw__util{
  height:42px;padding:0 12px;border:0;border-radius:12px;
  background:rgba(59,62,68,.96);color:#fff;
  border:1px solid rgba(255,255,255,.08);
  font:inherit;font-size:13px;font-weight:600;
  display:inline-flex;align-items:center;gap:6px;cursor:pointer;
}
.bb-draw__util--icon{width:42px;padding:0;justify-content:center;background-position:center;background-repeat:no-repeat;background-size:16px}
#bb-draw-trash{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><path d='M3 6h18M8 6V4h8v2M7 6l1 14h8l1-14'/></svg>")}
#bb-draw-info{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><circle cx='12' cy='12' r='9'/><path d='M12 10v6M12 7h.01'/></svg>")}
.bb-draw__util-ico--auto{
  width:14px;height:14px;
  background:
    linear-gradient(#fff,#fff) 0 0/5px 2px no-repeat,
    linear-gradient(#fff,#fff) 0 0/2px 5px no-repeat,
    linear-gradient(#fff,#fff) 100% 0/5px 2px no-repeat,
    linear-gradient(#fff,#fff) 100% 0/2px 5px no-repeat,
    linear-gradient(#fff,#fff) 0 100%/5px 2px no-repeat,
    linear-gradient(#fff,#fff) 0 100%/2px 5px no-repeat,
    linear-gradient(#fff,#fff) 100% 100%/5px 2px no-repeat,
    linear-gradient(#fff,#fff) 100% 100%/2px 5px no-repeat;
}
@media (max-width:900px){
  .bb-draw__shell{width:100%;height:100%;border-radius:0;padding:10px}
  .bb-draw__bar{grid-template-columns:1fr;gap:8px}
  .bb-draw__bar-left,.bb-draw__bar-right,.bb-draw__bar-center{justify-content:center;flex-wrap:wrap}
  .bb-draw__modes{max-width:100%;overflow-x:auto}
  .bb-draw__mode{font-size:12px;padding:0 12px;height:36px}
}

.bb-top-settings{
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.bb-top-settings__text{white-space:nowrap}
.bb-studio__pill-text{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:12rem;
}
.bb-studio__dd{position:relative}
.bb-studio__dd--model{z-index:60}
.bb-studio__dd-menu{
  position:absolute;
  left:0;bottom:calc(100% + 6px);
  z-index:70;
  min-width:max(100%, 88px);
  margin:0;padding:6px;
  list-style:none;
  border-radius:12px;
  border:1px solid var(--bb-border);
  background:var(--bb-panel-elevated);
  box-shadow:0 16px 40px rgba(0,0,0,.55);
  color:var(--text);
  pointer-events:auto;
}
.bb-studio__dd[data-dd="size"] .bb-studio__dd-menu,
.bb-studio__dd-menu--size{
  min-width:118px;
}
.bb-studio__dd-menu--aspect{
  min-width:148px;
  max-height:min(70vh, 570px);
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:8px 6px;
}
html[data-theme="light"] .bb-studio__dd-menu{
  background:#ffffff;
  border-color:var(--line);
  box-shadow:0 12px 28px rgba(15,23,42,.16);
}
.bb-studio__dd-menu[hidden]{display:none !important}
.bb-studio__dd-menu li{
  padding:8px 12px;
  border-radius:8px;
  cursor:pointer;
  font-size:13px;
  font-weight:600;
  color:var(--text);
}
.bb-aspect-opt,
.bb-size-opt{
  display:flex;align-items:center;gap:10px;
  padding:8px 10px !important;
}
.bb-aspect-ico{
  width:20px;height:20px;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:6px;
  color:inherit;
}
.bb-aspect-ico::before{
  content:"";
  border:1.5px solid currentColor;
  border-radius:3px;
  opacity:.55;
  width:10px;height:10px;
}
.bb-aspect-opt.is-selected .bb-aspect-ico,
.bb-aspect-opt[aria-selected="true"] .bb-aspect-ico{
  background:rgba(255,255,255,.08);
}
.bb-aspect-ico[data-ar="1:1"]::before,
.bb-aspect-ico[data-ar="Auto"]::before{width:10px;height:10px}
.bb-aspect-ico[data-ar="3:4"]::before{width:8px;height:11px}
.bb-aspect-ico[data-ar="4:3"]::before{width:11px;height:8px}
.bb-aspect-ico[data-ar="2:3"]::before{width:8px;height:12px}
.bb-aspect-ico[data-ar="3:2"]::before{width:12px;height:8px}
.bb-aspect-ico[data-ar="9:16"]::before{width:7px;height:12px}
.bb-aspect-ico[data-ar="16:9"]::before{width:12px;height:7px}
.bb-aspect-ico[data-ar="5:4"]::before{width:11px;height:9px}
.bb-aspect-ico[data-ar="4:5"]::before{width:9px;height:11px}
.bb-aspect-ico[data-ar="21:9"]::before{width:14px;height:6px}
.bb-size-ico{
  width:16px;height:16px;flex:0 0 auto;
  background:currentColor;
  opacity:.85;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='black'><path d='M9.783 0.5c.54 0 .894-.003 1.232.079a2.7 2.7 0 0 1 .43.144c.32.137.592.351 1.005.669.707.544 1.267.975 1.677 1.36.415.39.721.772.882 1.24a2.7 2.7 0 0 1 .145 1.19c-.044.492-.253.931-.565 1.398-.308.46-.752.994-1.31 1.668L10.617 11.463c-.502.606-.913 1.105-1.29 1.444-.389.351-.806.593-1.328.593s-.939-.242-1.328-.593c-.377-.339-.788-.838-1.29-1.444L2.719 8.247C2.161 7.573 1.716 7.039 1.408 6.579c-.312-.466-.521-.905-.564-1.397a2.7 2.7 0 0 1 .145-1.19c.161-.467.467-.85.882-1.24.41-.385.97-.816 1.678-1.36.412-.318.684-.532 1.005-.669.138-.06.282-.108.43-.144C5.321.997 5.674 1 6.214 1h3.569zm-3.12 3.667h2.667a.5.5 0 0 1 0 1H6.665a.5.5 0 1 1 0-1z'/></svg>") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='black'><path d='M9.783 0.5c.54 0 .894-.003 1.232.079a2.7 2.7 0 0 1 .43.144c.32.137.592.351 1.005.669.707.544 1.267.975 1.677 1.36.415.39.721.772.882 1.24a2.7 2.7 0 0 1 .145 1.19c-.044.492-.253.931-.565 1.398-.308.46-.752.994-1.31 1.668L10.617 11.463c-.502.606-.913 1.105-1.29 1.444-.389.351-.806.593-1.328.593s-.939-.242-1.328-.593c-.377-.339-.788-.838-1.29-1.444L2.719 8.247C2.161 7.573 1.716 7.039 1.408 6.579c-.312-.466-.521-.905-.564-1.397a2.7 2.7 0 0 1 .145-1.19c.161-.467.467-.85.882-1.24.41-.385.97-.816 1.678-1.36.412-.318.684-.532 1.005-.669.138-.06.282-.108.43-.144C5.321.997 5.674 1 6.214 1h3.569zm-3.12 3.667h2.667a.5.5 0 0 1 0 1H6.665a.5.5 0 1 1 0-1z'/></svg>") center/contain no-repeat;
}
.bb-draw__pop--aspect{
  max-height:min(60vh, 420px);
  overflow-y:auto;
}
.bb-draw__pop--aspect .bb-draw__pop-opt--compact{
  justify-content:flex-start;gap:8px;
}
.bb-studio__dd-menu li:hover,
.bb-studio__dd-menu li[aria-selected="true"],
.bb-studio__dd-menu li.is-selected{
  background:rgba(209,254,23,.16);
}

/* Меню моделей как у Higgsfield Featured models */
.bb-model-panel{
  position:absolute;
  left:0;
  bottom:calc(100% + 8px);
  z-index:80;
  width:min(400px, calc(100vw - 48px));
  max-height:min(40rem, calc(100vh - 12rem));
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:16px;
  border:1px solid var(--bb-border);
  background:var(--bb-panel-elevated);
  box-shadow:0 20px 48px rgba(0,0,0,.6);
  color:var(--text);
}
html[data-theme="light"] .bb-model-panel{
  background:#ffffff;
  border-color:var(--line);
  box-shadow:0 16px 40px rgba(15,23,42,.16);
}
.bb-model-panel[hidden]{display:none !important}
.bb-model-panel__title{
  padding:14px 16px 8px;
  font-size:13px;
  font-weight:700;
  color:var(--muted);
}
.bb-model-panel__search{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 12px 10px;
  padding:0 12px;
  height:40px;
  border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--bb-border);
}
.bb-model-panel__search:focus-within{
  border-color:rgba(209,254,23,.35);
}
.bb-model-panel__search-ico{
  width:14px;height:14px;flex:0 0 auto;
  border:2px solid var(--muted);
  border-radius:50%;
  position:relative;
  opacity:.7;
}
.bb-model-panel__search-ico::after{
  content:"";
  position:absolute;
  right:-3px;bottom:-3px;
  width:6px;height:2px;
  background:var(--muted);
  transform:rotate(45deg);
  transform-origin:left center;
}
.bb-model-panel__search-input{
  flex:1 1 auto;
  min-width:0;
  border:0;
  background:transparent;
  color:var(--text);
  font:inherit;
  font-size:14px;
  outline:none;
}
.bb-model-panel__search-input::placeholder{color:var(--muted)}
.bb-model-panel__list{
  overflow:auto;
  padding:0 8px 10px;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.bb-model-panel__item{
  display:flex;
  align-items:center;
  gap:0;
  width:100%;
  text-align:left;
  padding:6px 12px 6px 6px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  font:inherit;
}
.bb-model-panel__item:hover,
.bb-model-panel__item.is-selected{
  background:color-mix(in srgb, var(--text) 6%, transparent);
}
.bb-model-panel__item[hidden]{display:none !important}
.bb-model-panel__ico{
  width:40px;height:40px;
  margin-right:8px;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:color-mix(in srgb, var(--text) 6%, transparent);
  font-size:12px;
  font-weight:800;
  color:var(--bb-accent);
}
.bb-model-panel__meta{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.bb-model-panel__name{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:700;
  line-height:1.2;
}
.bb-model-panel__badge{
  display:inline-flex;
  align-items:center;
  padding:2px 6px;
  border-radius:6px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.02em;
  color:#303238;
  background:var(--bb-accent);
}
.bb-model-panel__desc{
  font-size:12px;
  color:var(--muted);
  line-height:1.35;
}
.bb-model-panel__check{
  width:16px;height:16px;
  flex:0 0 auto;
  margin-left:8px;
  opacity:0;
  background:
    linear-gradient(currentColor, currentColor) 20% 55%/2px 8px no-repeat,
    linear-gradient(currentColor, currentColor) 20% 55%/10px 2px no-repeat;
  transform:rotate(-45deg);
  color:var(--bb-accent);
}
.bb-model-panel__item.is-selected .bb-model-panel__check{opacity:1}
.bb-studio__generate.is-busy{
  opacity:.85;
}
.bb-studio__count{
  height:40px;
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:0 6px;
  border-radius:12px;
  border:1px solid var(--bb-border);
  background:var(--bb-surface-2);
}
html[data-theme="light"] .bb-studio__count{
  background:#f1f5f9;
  border-color:var(--line);
}
.bb-studio__count-btn{
  width:28px;height:28px;
  border:0;border-radius:8px;
  background:transparent;
  color:var(--text);
  font-size:16px;
  cursor:pointer;
}
.bb-studio__count-btn:disabled{opacity:.35;cursor:not-allowed}
.bb-studio__count-val{
  min-width:2.4rem;
  text-align:center;
  font-weight:700;
  font-size:13px;
}
.bb-studio__count-max{color:var(--muted);font-weight:500}

.bb-studio__aside{
  flex:0 0 auto;
  display:flex;
  align-items:stretch;
}
.bb-studio__generate{
  width:144px;
  min-height:84px;
  height:84px;
  align-self:flex-end;
  border:0;
  border-radius:12px;
  padding:12px 14px;
  background:var(--bb-accent);
  color:var(--bb-accent-text);
  font:inherit;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  box-shadow:0 8px 24px color-mix(in srgb, var(--bb-accent) 28%, transparent);
}
.bb-studio__generate:hover{filter:brightness(1.04)}
.bb-studio__generate:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.bb-studio__generate-label{letter-spacing:.01em}
.bb-studio__generate-meta{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:13px;
  font-weight:700;
  opacity:.85;
}
.bb-studio__generate-spark{
  width:12px;height:12px;
  background:currentColor;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M12 2l1.2 6.3L19 8l-4.5 3.6L16 18l-4-3.2L8 18l1.5-6.4L5 8l5.8-.7z'/></svg>") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M12 2l1.2 6.3L19 8l-4.5 3.6L16 18l-4-3.2L8 18l1.5-6.4L5 8l5.8-.7z'/></svg>") center/contain no-repeat;
}
.bb-studio__status{
  font-size:12px;
  color:var(--muted);
  min-height:0;
}
.bb-studio__status.is-error{color:#f87171}

.bb-detail{
  position:fixed;inset:0;z-index:1300;
  background:rgba(8,9,12,.88);
  backdrop-filter:blur(6px);
}
.bb-detail[hidden]{display:none !important}
.bb-detail__shell{
  display:grid;
  grid-template-columns:minmax(0,1fr) 23rem;
  height:100%;
  width:100%;
  overflow:hidden;
}
.bb-detail__stage{
  position:relative;
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:1fr auto;
  align-items:center;
  justify-items:center;
  padding:3.5rem 0 .75rem;
  overflow:hidden;
}
.bb-detail__figure{
  position:relative;
  width:100%;
  height:100%;
  margin:0;
  max-width:100%;
}
.bb-detail__img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:contain;
  display:block;
}
.bb-detail__close,
.bb-detail__side-close{
  position:absolute;top:14px;right:14px;z-index:2;
  width:36px;height:36px;border:0;border-radius:10px;
  background:rgba(255,255,255,.1);cursor:pointer;color:#fff;
}
.bb-detail__side-close{position:static}
.bb-detail__close::before,
.bb-detail__side-close::before{
  content:"\00D7";font-size:24px;line-height:1;display:block;
}
.bb-detail__side{
  display:grid;
  grid-template-rows:auto auto 1fr auto;
  gap:8px;
  margin:8px;
  min-height:0;
  border-radius:20px;
  border:1px solid var(--bb-border, rgba(255,255,255,.1));
  background:var(--bb-panel-elevated, #3b3e44);
  backdrop-filter:none;
  padding:8px;
  overflow:hidden;
}
html[data-theme="light"] .bb-detail__side{
  background:#ffffff;
  border-color:var(--line);
}
.bb-detail__head{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:8px;
  padding:4px;
}
.bb-detail__author{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:8px;
  min-width:0;
}
.bb-detail__avatar{
  width:32px;height:32px;border-radius:10px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--bb-accent) 55%, #333), #2a2d33);
}
.bb-detail__author-meta{min-width:0}
.bb-detail__author-name{
  margin:0;font-size:14px;font-weight:700;line-height:1.2;
  color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.bb-detail__author-role{
  margin:0;font-size:12px;color:var(--muted);
}
.bb-detail__tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4px;
  padding:4px;
  border-radius:12px;
  background:color-mix(in srgb, var(--text) 6%, transparent);
}
.bb-detail__tab{
  height:32px;border:0;border-radius:10px;
  background:transparent;color:var(--muted);
  font:inherit;font-size:13px;font-weight:700;cursor:pointer;
}
.bb-detail__tab.is-active{
  background:color-mix(in srgb, var(--surface) 95%, #000);
  color:var(--text);
  box-shadow:0 1px 2px rgba(0,0,0,.2);
}
.bb-detail__body{
  min-height:0;overflow:auto;padding:4px;
}
.bb-detail__panel[hidden]{display:none !important}
.bb-detail__card{
  display:flex;flex-direction:column;gap:8px;
  padding:8px;border-radius:12px;
  background:color-mix(in srgb, var(--text) 5%, transparent);
  min-height:10rem;
}
.bb-detail__prompt-h{
  display:flex;align-items:center;gap:8px;height:28px;padding:0 4px;
}
.bb-detail__label{
  margin:0;flex:1;font-size:12px;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--muted);
}
.bb-detail__copy{
  height:24px;min-width:66px;padding:0 8px;
  border-radius:8px;border:1px solid var(--line);
  background:transparent;color:var(--text);
  font-size:12px;font-weight:600;cursor:pointer;
}
.bb-detail__copy:hover{background:color-mix(in srgb, var(--text) 6%, transparent)}
.bb-detail__thumbs{
  display:flex;gap:4px;overflow-x:auto;padding:4px 0;
}
.bb-detail__thumb{
  position:relative;flex:0 0 auto;
  width:72px;height:72px;border-radius:10px;overflow:hidden;
  border:0;padding:0;cursor:pointer;background:#111;
}
.bb-detail__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.bb-detail__thumb.is-result{box-shadow:inset 0 0 0 2px var(--bb-accent)}
.bb-detail__thumb.is-ref{box-shadow:inset 0 0 0 2px rgba(255,255,255,.85)}
.bb-detail__thumb-badge{
  position:absolute;left:0;right:0;bottom:0;height:22px;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:800;letter-spacing:.02em;
  background:linear-gradient(transparent, rgba(0,0,0,.55));
  color:var(--bb-accent);
}
.bb-detail__thumb.is-ref .bb-detail__thumb-badge{color:#fff}
.bb-detail__prompt-scroll{
  max-height:12rem;overflow:auto;padding:4px 4px 0;
}
.bb-detail__prompt-text{
  margin:0;font-size:14px;line-height:1.45;color:var(--text);
  white-space:pre-wrap;word-break:break-word;
}
.bb-detail__details{margin-top:10px}
.bb-detail__details-h{
  width:100%;display:flex;align-items:center;justify-content:space-between;
  height:28px;padding:0 4px;border:0;background:transparent;
  color:var(--muted);font:inherit;font-size:12px;font-weight:700;
  letter-spacing:.04em;cursor:pointer;
}
.bb-detail__chev{
  width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg);transition:transform .15s ease;
}
.bb-detail__details-h[aria-expanded="false"] .bb-detail__chev{transform:rotate(-135deg)}
.bb-detail__details-body{
  border-radius:12px;overflow:hidden;
  background:color-mix(in srgb, var(--text) 5%, transparent);
}
.bb-detail__details-body[hidden]{display:none !important}
.bb-detail__row{
  display:grid;grid-template-columns:1fr max-content;
  gap:12px;align-items:center;
  padding:10px 12px;
  border-bottom:1px solid color-mix(in srgb, var(--line) 70%, transparent);
  font-size:14px;
}
.bb-detail__row:last-child{border-bottom:0}
.bb-detail__row span{color:var(--muted)}
.bb-detail__row strong{font-weight:600;color:var(--text)}
.bb-detail__tools-hint{margin:0 0 8px;color:var(--muted);font-size:13px}
.bb-detail__tool-btn{
  display:flex;align-items:center;justify-content:center;
  width:100%;min-height:40px;margin:0 0 8px;padding:0 12px;
  border-radius:12px;border:1px solid var(--line);
  background:color-mix(in srgb, var(--text) 5%, transparent);
  color:var(--text);font:inherit;font-weight:600;text-decoration:none;cursor:pointer;
}
.bb-detail__actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  padding:8px;
}
.bb-detail__btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:40px;padding:0 12px;border-radius:12px;
  border:1px solid var(--line);
  background:color-mix(in srgb, var(--text) 6%, transparent);
  color:var(--text);font:inherit;font-size:13px;font-weight:700;
  text-decoration:none;cursor:pointer;
}
.bb-detail__btn--primary{
  grid-column:1 / -1;
  border-color:transparent;
  background:var(--bb-accent);
  color:var(--bb-accent-text);
}
@media (max-width:960px){
  .bb-detail__shell{grid-template-columns:1fr;grid-template-rows:minmax(38vh,1fr) minmax(0,55vh)}
  .bb-detail__side{margin:0;border-radius:16px 16px 0 0;max-width:none}
  .bb-detail__stage{padding:2.5rem 8px .5rem}
  .bb-detail__close{top:10px;right:10px}
}

/* —— Tablet / mobile dock (Higgsfield-like compact bottom sheet) —— */
@media (max-width:1024px){
  .main:has(.bb-studio){
    padding-left:0 !important;
    padding-right:0 !important;
    padding-bottom:0 !important;
  }
  .main:has(.bb-studio) > .topbar{
    margin-bottom:4px;
  }
}
@media (max-width:820px){
  .main:has(.bb-studio) > .topbar{
    padding-left:10px;
    padding-right:10px;
  }
  .bb-top-settings{
    padding:6px 10px;
    font-size:12px;
  }
  .bb-studio{
    margin:0;
  }
  .bb-studio__feed{
    padding:4px 4px calc(18rem + env(safe-area-inset-bottom, 0px));
  }
  .bb-studio__feed-tools{
    padding:2px 4px 0;
    margin-bottom:4px;
  }
  .bb-zoom{
    height:28px;
    padding:0 10px 0 8px;
    gap:8px;
  }
  .bb-zoom__range{width:96px}
  .bb-studio__grid{
    --bb-card-min:0px;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:2px;
  }
  .bb-studio__dock-wrap{
    left:0;
    right:0;
    bottom:0;
    transform:none;
    width:100%;
    max-width:none;
    padding:0;
    padding-bottom:env(safe-area-inset-bottom, 0px);
  }
  .bb-studio__form{
    flex-direction:column;
    gap:10px;
    padding:12px 12px 10px;
    border-radius:20px 20px 0 0;
    border-left:0;
    border-right:0;
    border-bottom:0;
    box-shadow:0 -12px 40px rgba(0,0,0,.45);
  }
  .bb-studio__aside{width:100%}
  .bb-studio__generate{
    width:100%;
    min-height:48px;
    height:48px;
    flex-direction:row;
    gap:10px;
    align-self:stretch;
    border-radius:14px;
  }
  .bb-studio__prompt-row{
    gap:8px;
  }
  .bb-studio__refs{
    max-width:none;
    flex:0 0 auto;
  }
  .bb-studio__prompt-wrap{max-height:5.5rem}
  .bb-studio__prompt{
    min-height:2.5rem;
    max-height:none;
    font-size:14px;
  }
  .bb-studio__toolbar{
    gap:6px;
    min-height:0;
  }
  .bb-studio__pill{
    height:36px;
    padding:0 10px;
    font-size:12px;
    border-radius:10px;
  }
  .bb-studio__pill-text{max-width:6.5rem}
  .bb-studio__count{
    height:36px;
    border-radius:10px;
  }
  .bb-studio__dd--model{flex:1 1 auto;min-width:0}
  .bb-studio__dd--model .bb-studio__pill{width:100%;justify-content:flex-start}
  .bb-model-panel{
    left:0;
    right:0;
    width:auto;
    min-width:0;
    max-width:none;
    max-height:min(52vh, 360px);
  }
  .bb-studio__dd-menu{
    max-height:min(40vh, 260px);
    overflow:auto;
  }
}

@media (max-width:560px){
  .bb-studio__feed{
    padding-bottom:calc(16.5rem + env(safe-area-inset-bottom, 0px));
  }
  .bb-zoom__range{width:72px}
  .bb-studio__pill-text{max-width:5rem}
  .bb-studio__pill--draw{
    width:36px;
    padding:0;
    justify-content:center;
  }
  .bb-studio__pill-draw-label{display:none}
  .bb-top-settings__text{display:none}
  .bb-detail__shell{grid-template-rows:minmax(36vh,1fr) minmax(0,58vh)}
  .bb-detail__actions{grid-template-columns:1fr}
  .bb-detail__btn--primary{grid-column:auto}
}

@media (max-width:380px){
  .bb-studio__form{padding:10px 10px 8px;gap:8px}
  .bb-studio__feed{
    padding-bottom:calc(15.5rem + env(safe-area-inset-bottom, 0px));
  }
  .bb-studio__pill-text{max-width:4.2rem}
  .bb-studio__toolbar{gap:5px}
  .bb-zoom{display:none} /* как у Higgsfield mobile — фокус на 2-col сетке */
}

/* Landscape phones: keep dock compact, 3-col gallery if wide enough */
@media (max-width:820px) and (max-height:480px) and (orientation:landscape){
  .bb-studio__feed{padding-bottom:calc(9.5rem + env(safe-area-inset-bottom, 0px))}
  .bb-studio__form{padding:8px 12px;gap:6px;border-radius:16px 16px 0 0}
  .bb-studio__prompt-wrap{max-height:3.2rem}
  .bb-studio__prompt{min-height:32px;max-height:none}
  .bb-studio__generate{min-height:40px;height:40px}
  .bb-studio__grid{grid-template-columns:repeat(3, minmax(0, 1fr))}
  .bb-studio__toolbar{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .bb-studio__toolbar::-webkit-scrollbar{display:none}
  .bb-studio__pill,.bb-studio__count{flex:0 0 auto}
}

/* =========================================================
   Orders page — TailAdmin metric cards / clean panels
   ========================================================= */
.orders-page{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.orders-page-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.orders-page-head__title{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0;
  font-size:clamp(1.35rem, 2.2vw, 1.75rem);
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--text);
}
.orders-page-head__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:1.75rem;
  height:1.55rem;
  padding:0 8px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  color:#fff;
  background:var(--brand);
}
.orders-page-head__actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
@media (min-width:721px){
  .orders-page-head__actions--mobile{display:none}
}

.orders-page .orders-panel{
  margin:0;
  border-color:var(--line);
  box-shadow:var(--shadow);
  background:var(--card-bg);
}

.orders-page .orders-period{margin-bottom:0}
.orders-page .orders-period .btn-period.active{
  background:var(--surface-brand-soft);
  border-color:var(--brand);
  color:var(--text);
}

.orders-service-chips{
  /* сетка и gap как у .grid.cols-4.orders-kpi-grid */
  margin:0;
}
.orders-service-chips.orders-kpi-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.orders-service-chips .orders-chip{
  /* размер/стек наследуют .orders-kpi; без отдельного «мини»-карточного стиля */
  cursor:default;
}
.orders-page .orders-service-chips{
  margin-bottom:0;
}

.orders-channel-chips.orders-kpi-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.orders-channel-chips .orders-chip--channel{
  min-height:132px;
  align-items:flex-start;
}
.orders-channel-chips .orders-channel-net{
  margin-top:4px;
  font-size:13px;
  font-weight:700;
}
.orders-channel-chips .orders-channel-net.is-plus{color:var(--ok, #3f9c6c);}
.orders-channel-chips .orders-channel-net.is-minus{color:var(--danger, #d64545);}
@media (max-width:1200px){
  .orders-channel-chips.orders-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .orders-channel-chips.orders-kpi-grid{grid-template-columns:1fr}
}

.orders-kpi-grid{
  margin:0;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.admin-dashboard .orders-kpi-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media (max-width:1200px){
  .admin-dashboard .orders-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .admin-dashboard .orders-kpi-grid{grid-template-columns:1fr}
  .admin-dashboard .chart-wrap,
  .admin-dashboard .chart-wrap--donut{height:260px;min-height:240px}
  .admin-dashboard .grid.cols-2{grid-template-columns:1fr}
}
.admin-dashboard .orders-kpi-grid .orders-kpi{
  padding:16px 14px;
  gap:8px;
  min-height:112px;
}
.admin-dashboard .orders-kpi-grid .orders-kpi__chart{
  flex:0 0 64px;
  width:64px;
}
.admin-dashboard .orders-kpi-grid .orders-kpi .value{
  font-size:clamp(1.15rem, 1.6vw, 1.45rem);
}
.admin-dashboard .orders-kpi-secondary{
  grid-template-columns:1fr;
}
.orders-page .orders-kpi,
.admin-dashboard .orders-kpi{
  position:relative;
  display:flex;
  flex-direction:row;
  align-items:stretch;
  gap:12px;
  padding:20px 24px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--card-bg);
  box-shadow:none;
  min-height:120px;
}
.orders-kpi--print{border-color:var(--line)}
.orders-kpi__icon{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  color:var(--brand);
  background:var(--surface-brand-soft);
}
.orders-kpi--print .orders-kpi__icon{
  color:var(--violet);
  background:var(--surface-violet-soft);
}
.orders-kpi__body{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
  z-index:1;
}
.orders-page .orders-kpi .label,
.admin-dashboard .orders-kpi .label{
  color:var(--muted);
  font-size:12px;
  font-weight:600;
}
.orders-page .orders-kpi .value,
.admin-dashboard .orders-kpi .value{
  color:var(--text);
  font-size:clamp(1.45rem, 2.4vw, 1.85rem);
  font-weight:800;
  margin:0;
  line-height:1.1;
}
.orders-kpi--print .value{color:var(--text)}
.orders-page .orders-kpi .hint,
.admin-dashboard .orders-kpi .hint{
  color:var(--muted);
  font-size:12px;
  margin:0;
  padding:0;
  -webkit-line-clamp:2;
}
.orders-kpi__delta{
  font-size:12px;
  font-weight:700;
  color:var(--brand);
}
.orders-kpi--print .orders-kpi__delta{color:var(--violet)}
.orders-kpi__chart{
  flex:0 0 88px;
  width:88px;
  align-self:center;
  opacity:.72;
  z-index:0;
}
.orders-kpi__chart svg{
  display:block;
  width:100%;
  height:44px;
}
.orders-kpi__chart--bars svg{height:48px}

.orders-kpi-secondary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-3, 12px);
  margin:0;
}
.orders-kpi-secondary.orders-kpi-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.orders-page .orders-kpi-secondary .orders-kpi{
  text-decoration:none;
  color:inherit;
}
.orders-kpi--created .orders-kpi__icon{
  color:var(--brand);
  background:var(--surface-brand-soft);
}
.orders-kpi--created .orders-kpi__delta{color:var(--brand)}
.orders-kpi--urgent .orders-kpi__icon{
  color:var(--violet);
  background:var(--surface-violet-soft);
}
.orders-kpi--urgent .orders-kpi__delta{color:var(--violet)}
.admin-dashboard .orders-kpi-secondary .orders-kpi{
  min-height:108px;
  padding:16px 18px;
}
.admin-dashboard .orders-kpi-secondary .orders-kpi .value{
  font-size:clamp(1.25rem, 2vw, 1.55rem);
}
.admin-dashboard .orders-kpi-fin-grid,
.admin-dashboard .orders-kpi-meta-grid{
  margin-top:12px;
}
.admin-dashboard .orders-kpi--compact{
  min-height:100px;
  padding:16px 18px;
}
.admin-dashboard .orders-kpi--compact .value{
  font-size:clamp(1.2rem, 2vw, 1.45rem);
}
.admin-dashboard .orders-kpi--strong{
  border-color:color-mix(in srgb, var(--brand) 35%, var(--line));
  background:color-mix(in srgb, var(--brand-soft, rgba(16,185,129,.12)) 55%, var(--card-bg));
}
.admin-dashboard .orders-kpi__delta.muted-text{
  color:var(--muted);
  font-weight:600;
}
@media (max-width:1100px){
  .admin-dashboard .orders-kpi-fin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .admin-dashboard .orders-kpi-fin-grid,
  .admin-dashboard .orders-kpi-meta-grid{grid-template-columns:1fr}
}

.orders-page .orders-filters,
.orders-page .orders-table-card{margin-top:0}

.orders-page .orders-table thead th{
  color:var(--muted);
  font-weight:700;
  letter-spacing:.02em;
  border-bottom-color:var(--line);
  background:var(--surface-inset);
}
.orders-page .orders-table tbody tr:hover{
  background:var(--bg-soft);
}
.orders-page .orders-status-printing{
  border-color:var(--st-printing);
  color:var(--st-printing);
}
.orders-page .orders-status-active{
  border-color:var(--st-active);
  color:var(--st-active);
}
.orders-page .orders-status-completed{
  border-color:var(--st-completed);
  color:var(--st-completed);
}
.orders-page .orders-status-in_delivery{
  border-color:var(--st-delivery);
  color:var(--st-delivery);
}

.topbar .orders-page-cta.btn.primary{
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
  font-weight:700;
  box-shadow:none;
}
.topbar .orders-page-cta.btn.primary:hover{
  filter:brightness(1.06);
}
.topbar .orders-page-export{margin-right:4px}

@media (max-width:980px){
  .orders-kpi-grid{grid-template-columns:1fr}
  .orders-service-chips.orders-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .orders-period .card-b{
    min-width:0;
  }
  .orders-period .dashboard-period-row{
    align-items:stretch;
  }
  .orders-period .btn-group-period{
    display:flex;
    flex-wrap:nowrap;
    gap:6px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    padding-bottom:4px;
    max-width:100%;
  }
  .orders-period .btn-period{
    flex:0 0 auto;
  }
}
@media (max-width:720px){
  .orders-kpi__chart{flex-basis:72px;width:72px}
  .orders-page .orders-kpi .value{font-size:clamp(18px,5vw,22px)}
  .orders-kpi-secondary{grid-template-columns:1fr}
}
@media (max-width:640px){
  .orders-service-chips.orders-kpi-grid{grid-template-columns:1fr}
}
@media (max-width:520px){
  .orders-page-head__actions{width:100%}
  .orders-page-head__actions .btn{flex:1 1 auto}
}

/* —— Admin dashboard: TailAdmin CRM patterns —— */
.admin-dashboard{
  display:flex;
  flex-direction:column;
  gap:24px;
}
.admin-dashboard > .grid,
.admin-dashboard > .card{
  margin-top:0 !important;
  margin-bottom:0 !important;
}
.admin-dashboard > .grid[style*="margin-top"],
.admin-dashboard > .card[style*="margin-top"]{
  margin-top:0 !important;
}
.admin-dashboard .dashboard-period-card .card-b{
  padding:16px 20px;
}
.admin-dashboard .dashboard-period-label{
  font-weight:500;
  font-size:13px;
  margin-bottom:10px;
}
.admin-dashboard .attention-card .card-b{
  padding:16px 20px;
}
.admin-dashboard a.kpi-link:hover{
  transform:none;
  border-color:var(--line);
  background:var(--surface-inset);
}
.admin-dashboard a.orders-kpi{
  text-decoration:none;
  color:inherit;
}
.admin-dashboard a.orders-kpi:hover{
  border-color:var(--brand);
  background:var(--card-bg);
}
.admin-dashboard a.kpi-link:hover .value{
  color:var(--brand);
}
.admin-dashboard .service-item{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface-inset);
  padding:14px 16px;
}
.admin-dashboard .chart-table thead th{
  background:var(--surface-inset);
  font-weight:600;
  text-transform:none;
  letter-spacing:0;
}
.admin-dashboard .chart-wrap{
  border:0;
  background:transparent;
  padding:8px 0 0;
  border-radius:0;
}
.admin-dashboard .chart-wrap .chart-canvas{
  filter:none;
}
.admin-dashboard .chart-card .card-b{
  padding-top:8px;
}
.admin-dashboard .chart-card{
  border:1px solid var(--line);
  background:var(--card-bg);
  box-shadow:none;
}
.admin-dashboard .chart-card .card-h{
  padding-bottom:0;
}
.admin-dashboard .chart-card .card-h .small{
  max-width:52rem;
  line-height:1.45;
}
.admin-dashboard .metric-strip{
  gap:16px;
  padding:4px 0;
}
.admin-dashboard .metric-pill{
  background:var(--card-bg);
  border:1px solid var(--line);
  box-shadow:none;
}
@media (max-width:1100px){
  .admin-dashboard .grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .admin-dashboard .grid.cols-4,
  .admin-dashboard .grid.cols-2{grid-template-columns:1fr}
  .admin-dashboard .kpi{padding:20px;min-height:108px}
  .admin-dashboard .kpi .value{font-size:1.5rem}
  .admin-dashboard .dashboard-period-presets-scroll .btn-group-period{
    border-radius:12px;
  }
}

/* === Services catalog (categories + items) === */
.services-catalog-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px;}
.services-catalog-tab{
  display:inline-flex;align-items:center;padding:8px 16px;border-radius:999px;
  border:1px solid var(--line);background:var(--surface);color:var(--text);font-weight:600;font-size:14px;
}
.services-catalog-tab.is-active{background:var(--brand-soft,rgba(16,185,129,.12));border-color:var(--brand);color:var(--text);}
.svc-cat-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;
}
.svc-cat-card{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  min-height:108px;padding:16px 12px;border-radius:12px;
  border:1px solid var(--line);background:var(--surface);text-align:center;
  color:var(--text);transition:border-color .15s ease, box-shadow .15s ease;
}
.svc-cat-card:hover{border-color:var(--brand);opacity:1;}
.svc-cat-card.is-active{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-soft,rgba(16,185,129,.18));}
.svc-cat-card__icon{
  width:40px;height:40px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;
  font-size:20px;line-height:1;background:var(--surface-inset);
}
.svc-cat-card:nth-child(odd) .svc-cat-card__icon{background:rgba(16,185,129,.14);}
.svc-cat-card:nth-child(even) .svc-cat-card__icon{background:rgba(139,92,246,.14);}
.svc-cat-card__label{
  font-size:12px;font-weight:700;letter-spacing:.04em;line-height:1.25;
  color:var(--text);
}
.order-service-pick-panel{
  margin-top:10px;
  padding:12px 14px;
}
.order-service-pick-panel__head{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:6px 12px;
  margin-bottom:10px;
}
.order-service-pick-panel__title{
  font-weight:800;
  font-size:14px;
  line-height:1.2;
  color:var(--text);
}
.order-service-pick-panel__hint{
  margin:0;
  opacity:.9;
}
.order-service-pick-panel__warn{
  margin:0 0 8px;
}
.order-service-pick{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr);
  gap:10px 12px;
  align-items:start;
  width:100%;
}
.order-service-pick:has(> .order-service-pick__tier:not([hidden])){
  grid-template-columns:minmax(0,1fr) minmax(0,.85fr) minmax(0,1.4fr);
}
.order-service-pick > .field{
  margin:0;
  min-width:0;
}
.order-service-pick > .field > label{
  display:block;
  margin-bottom:4px;
  font-size:12px;
  color:var(--muted);
  font-weight:600;
}
.order-service-pick__cat,
.order-service-pick__tier,
.order-service-pick__item{
  width:auto;
  max-width:none;
  flex:none;
}
.order-service-pick select{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
.order-service-addons{
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid var(--line);
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  align-items:center;
}
.order-service-addons[hidden]{
  display:none !important;
}
.order-service-addon-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0;
  font-size:13px;
  font-weight:600;
  color:var(--text);
  cursor:pointer;
  user-select:none;
}
.order-service-addon-toggle[hidden]{
  display:none !important;
}
.order-service-addon-toggle.is-disabled{
  opacity:.55;
}
.order-service-addon-toggle input{
  width:auto;
  margin:0;
}
@media (max-width:720px){
  .svc-cat-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .order-service-pick,
  .order-service-pick:has(> .order-service-pick__tier:not([hidden])){
    grid-template-columns:1fr;
  }
}
@media (max-width:420px){
  .svc-cat-grid{grid-template-columns:1fr;}
}

/* —— Матрица цен печати (/services/prices) —— */
.price-matrix-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;}
.price-matrix-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0;}
.price-matrix-frame{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.price-matrix-wrap{overflow:auto;max-width:100%;}
.price-matrix-table{min-width:920px;border-collapse:separate;border-spacing:0;}
.price-matrix-table th,.price-matrix-table td{padding:6px 8px;vertical-align:middle;}
.price-matrix-table .pm-size{position:sticky;left:0;background:var(--card,#3b3e44);z-index:2;min-width:7rem;}
.price-matrix-table .pm-group{text-align:center;font-size:12px;border-bottom:1px solid var(--line);}
.price-matrix-table .pm-sub{font-size:11px;color:var(--muted);text-align:center;min-width:4.5rem;}
.price-matrix-table .pm-cell input{
  width:100%;min-width:4.25rem;max-width:5.5rem;box-sizing:border-box;
  font-variant-numeric:tabular-nums;text-align:right;padding:6px 8px;
}
.price-matrix-table .pm-empty{color:var(--muted);text-align:center;}
.price-matrix-table .pm-placeholder{background:rgba(245,158,11,.12);}
@media (max-width:640px){
  .price-matrix-table{min-width:760px;}
  .price-matrix-toolbar{flex-direction:column;align-items:stretch;}
}

/* —— Contacts pass 2: заказы + чаты (только стиль) —— */
.orders-page{
  gap:20px;
}
.orders-page-head{
  margin-bottom:2px;
  padding-bottom:2px;
}
.orders-page-head__title{
  font-size:clamp(1.35rem, 2vw, 1.65rem);
  font-weight:700;
  letter-spacing:-.025em;
}
.orders-page-head__badge{
  min-width:1.6rem;
  height:1.45rem;
  font-size:11px;
  font-weight:700;
  background:var(--surface-brand-soft);
  color:var(--brand);
  border:1px solid color-mix(in srgb, var(--brand) 28%, transparent);
}
.orders-page-head__actions .btn{
  border-radius:var(--radius-sm,8px);
  font-weight:500;
}
.orders-page .orders-panel.orders-period .card-b{
  padding:14px 16px;
}
.orders-page .orders-filters .card-b{
  padding:16px 18px;
}
.orders-page .orders-table-card .card-h{
  padding:16px 18px 0;
}
.orders-page .orders-table-card .card-b{
  padding:12px 18px 18px;
}
.orders-page .orders-table thead th{
  text-transform:none;
  font-size:12px;
  letter-spacing:0;
  font-weight:500;
  color:var(--muted);
  padding-top:12px;
  padding-bottom:12px;
  background:var(--surface-inset);
}
.orders-page .orders-table tbody td{
  padding-top:12px;
  padding-bottom:12px;
}
.orders-page .orders-kpi,
.admin-dashboard .orders-kpi{
  transition:border-color .15s ease, box-shadow .15s ease;
}
.orders-page .orders-kpi:hover,
.admin-dashboard a.orders-kpi:hover{
  border-color:color-mix(in srgb, var(--brand) 35%, var(--line));
  box-shadow:var(--shadow);
}

/* Чаты: колонки как card-panels Contacts */
.msg-inbox{
  gap:16px;
}
.msg-col.card{
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  background:var(--card-bg);
  border:1px solid var(--line);
}
.msg-channel-bar{
  padding:12px 14px 12px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--card-bg);
  box-shadow:var(--shadow);
}
.msg-list-tools{
  padding:10px 12px;
  border-bottom:1px solid var(--line);
  background:var(--surface-inset);
}
.msg-chat-head{
  border-bottom:1px solid var(--line);
}
html[data-theme="light"] .msg-list-tools{
  background:var(--surface-inset);
}
@media (max-width:720px){
  .msg-inbox{gap:0}
  .msg-channel-bar{
    border-radius:0;
    border-left:0;
    border-right:0;
    box-shadow:none;
  }
}

/* —— Contacts global pass 3: меню + все экраны —— */
.sidebar > .footer{
  font-size:11px;
  color:var(--muted);
  opacity:.85;
  padding-top:12px;
  border-top:1px solid var(--line);
  margin-top:12px;
}
.nav a{
  transition:background .12s ease,color .12s ease;
}
.nav-group > summary{
  letter-spacing:.06em;
}
.topbar-user{
  border-radius:999px;
  padding:4px 10px 4px 4px;
  gap:8px;
}
.topbar-logout{
  border-radius:10px;
  min-height:36px;
}
.flash{
  margin-bottom:0;
  border-radius:12px;
  box-shadow:none;
}
.badge{
  font-weight:600;
  letter-spacing:.01em;
}
.crm-panel-soft{
  border-radius:var(--radius);
  box-shadow:none;
}
.admin-dashboard,
.editor-home-dashboard,
.finance-page,
.stats-page,
.reports-page,
.services-page,
.periods-page,
.kpi-page,
.contests-admin-page,
.audit-page,
.tasks-page,
.schedules-page,
.about-page{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.admin-dashboard > .card,
.editor-home-dashboard > .card,
.finance-page > .card,
.stats-page > .card,
.reports-page > .card{
  margin-top:0 !important;
  margin-bottom:0 !important;
}
/* Страницы без обёртки: прямые .card уже с gap через .main-body */
.main-body > .grid{
  margin:0;
}
.main-body > h1,
.main-body > h2{
  margin-top:0;
}
.main-body > .small[style*="margin"]{
  margin-top:0 !important;
}
/* Формы: единые карточки */
.main-body form.card,
.main-body > form > .card{
  box-shadow:none;
}
/* Фильтры на любых списках */
.crm-filters .card-b,
.card .crm-filters{
  min-width:0;
}
.crm-filter-actions{
  border-top-color:var(--line);
}
/* Диалоги / модалки */
.crm-dialog,
dialog.crm-dialog{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--card-bg);
  color:var(--text);
  box-shadow:0 16px 48px rgba(16,24,40,.28);
  padding:0;
}
/* Услуги / матрица цен */
.price-matrix-tabs{
  padding:4px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-inset);
  width:fit-content;
  max-width:100%;
  gap:4px;
}
.price-matrix-tabs .btn,
.price-matrix-tabs a{
  border-radius:9px;
  border-color:transparent;
  background:transparent;
  min-height:34px;
}
.price-matrix-tabs .btn.active,
.price-matrix-tabs a.active,
.price-matrix-tabs .is-active{
  background:var(--card-bg);
  color:var(--text);
  box-shadow:none;
}
/* Редакторы / пользователи */
.editors-table-compact th{
  white-space:nowrap;
}
/* Чаты: main-body без лишнего gap между модулями */
.main:not(.main--guest-login):has(#msg-inbox) > .main-body{
  gap:0;
}
.main:not(.main--guest-login):has(#msg-inbox) #msg-inbox{
  flex:1 1 auto;
  min-height:0;
}

/* —— Contacts polish pass 4: menu-item + soft charts —— */
.nav a.active{
  background:var(--surface-brand-soft);
  color:var(--brand);
}
html[data-theme="light"] .nav a.active{
  background:rgba(18,183,106,.10);
}
.nav a:focus-visible{
  outline:2px solid var(--ring-brand);
  outline-offset:1px;
}
.sidebar .brand{
  padding:2px 4px 10px;
}
.empty-state{
  border:1px dashed var(--line);
  border-radius:var(--radius);
  background:var(--card-bg);
  padding:40px 20px;
}
.crm-section-tabs{
  box-shadow:none;
}
.orders-page-head__badge,
.badge.ok,.badge.warn,.badge.danger,.badge.printing,.badge.delivery{
  border-radius:999px;
}
.admin-dashboard .chart-card .chart-title{
  font-size:16px;
  font-weight:600;
  letter-spacing:-.02em;
}
.admin-dashboard .orders-kpi__chart{
  opacity:.7;
}
.metric-pill__value{
  font-weight:700;
  letter-spacing:-.02em;
}
.services-catalog-tab{
  border-radius:9px;
}
.services-catalog-tab.is-active{
  background:var(--card-bg);
  border-color:transparent;
  box-shadow:none;
  color:var(--text);
}
.svc-cat-card{
  box-shadow:none;
}
.svc-cat-card:hover{
  box-shadow:none;
  border-color:var(--brand);
}

/* —— Dark theme TailAdmin hierarchy: canvas / sidebar+cards / inset —— */
html:not([data-theme="light"]) .theme-switch__btn,
html:not([data-theme="light"]) .metric-pill,
html:not([data-theme="light"]) .attention-chip,
html:not([data-theme="light"]) .orders-kpi,
html:not([data-theme="light"]) .crm-panel-soft,
html:not([data-theme="light"]) .admin-dashboard .chart-card,
html:not([data-theme="light"]) .admin-dashboard .service-item{
  background:var(--card-bg);
  border-color:var(--line);
  box-shadow:none;
}
html:not([data-theme="light"]) .crm-section-tabs,
html:not([data-theme="light"]) .price-matrix-tabs,
html:not([data-theme="light"]) .services-catalog-tabs{
  background:var(--surface-inset);
  border-color:var(--line);
}
html:not([data-theme="light"]) .crm-section-tab.is-active,
html:not([data-theme="light"]) .price-matrix-tabs .btn.active,
html:not([data-theme="light"]) .price-matrix-tabs a.active,
html:not([data-theme="light"]) .services-catalog-tab.is-active{
  background:var(--card-bg);
  color:var(--text);
  box-shadow:none;
}
html:not([data-theme="light"]) .table th{
  background:var(--surface-inset);
  color:var(--muted);
}
html:not([data-theme="light"]) .table-wrap{
  background:var(--card-bg);
  border-color:var(--line);
}
html:not([data-theme="light"]) input,
html:not([data-theme="light"]) select:not(.msg-deal-select),
html:not([data-theme="light"]) textarea{
  background:var(--surface-inset);
  border-color:var(--line);
  color:var(--text);
}
html:not([data-theme="light"]) .flash{
  background:var(--card-bg);
  border-color:var(--line);
}
html:not([data-theme="light"]) .sidebar{
  background:var(--sidebar-bg);
  border-right-color:var(--line);
}
html:not([data-theme="light"]) .nav a > span:not(.nav-msg-badge){
  background:rgba(152,162,179,.10);
}
html:not([data-theme="light"]) .nav a.active > span:not(.nav-msg-badge){
  background:color-mix(in srgb, var(--brand) 22%, transparent);
}
html:not([data-theme="light"]) .msg-col.card,
html:not([data-theme="light"]) .msg-chat.card,
html:not([data-theme="light"]) .msg-conv-list,
html:not([data-theme="light"]) .notifications-dropdown{
  background:var(--panel);
  border-color:var(--line);
}

/* —— TailAdmin pass 6: contrast ladder + buttons/blocks closer to demo —— */
body{
  color:var(--text);
  background:var(--bg);
  font-family:var(--font);
}
.muted,.small,.hint,.kpi .hint,.kpi .label{
  color:var(--muted);
}
.topbar{
  min-height:72px;
  padding:12px 28px;
  border-bottom:1px solid var(--line);
  background:var(--topbar-bg);
  color:var(--text);
}
.nav{
  margin-top:20px;
  gap:4px;
}
.nav a{
  border-radius:var(--radius-sm,8px);
  color:#98a2b3;
}
html[data-theme="light"] .nav a{color:#667085}
.nav a:hover{
  color:var(--text);
  background:var(--bg-soft);
}
.nav a.active{
  background:var(--surface-brand-soft);
  color:var(--brand);
}
.card .card-h .small,
.chart-card .card-h .small,
.main .small{
  color:var(--muted);
  font-size:14px;
  font-weight:400;
  line-height:1.5;
}
.btn.primary{font-weight:500}
.btn.small{border-radius:var(--radius-sm,8px);font-weight:500}
input,select,textarea{
  border-radius:var(--radius-sm,8px);
  font-size:14px;
  color:var(--text);
  background:var(--input-bg);
  border-color:var(--line);
}
.crm-section-tabs,
.price-matrix-tabs{
  border-radius:var(--radius-sm,8px);
  padding:4px;
  background:var(--surface-inset);
  border:1px solid var(--line);
}
.table-wrap{
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  border:1px solid var(--line);
  background:var(--card-bg);
  color:var(--text);
}
.orders-page .orders-kpi,
.admin-dashboard .orders-kpi,
.metric-pill,
.attention-chip,
.flash{
  box-shadow:var(--shadow);
}
.crm-dialog,
dialog.crm-dialog{
  box-shadow:var(--shadow) !important;
}
html[data-theme="light"] .sidebar{
  border-right:1px solid #e4e7ec;
  background:#fff;
}
html[data-theme="light"] .topbar{
  border-bottom:1px solid #e4e7ec;
  background:#fff;
}
html[data-theme="light"] .card,
html[data-theme="light"] .orders-kpi,
html[data-theme="light"] .admin-dashboard .orders-kpi,
html[data-theme="light"] .table-wrap,
html[data-theme="light"] .metric-pill{
  background:#fff;
  border-color:#e4e7ec;
  color:#303238;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
html[data-theme="light"] .crm-dialog,
html[data-theme="light"] dialog.crm-dialog{
  box-shadow:0 1px 2px rgba(16,24,40,.04) !important;
}
/* Dark: visible borders vs cards/sidebar (never line==fill) */
html:not([data-theme="light"]) .card,
html:not([data-theme="light"]) .orders-kpi,
html:not([data-theme="light"]) .admin-dashboard .orders-kpi,
html:not([data-theme="light"]) .table-wrap,
html:not([data-theme="light"]) .metric-pill,
html:not([data-theme="light"]) .admin-dashboard .chart-card,
html:not([data-theme="light"]) .admin-dashboard .service-item{
  background:#3b3e44;
  border-color:#555a62;
  color:#f9fafb;
  box-shadow:0 1px 3px rgba(0,0,0,.28);
}
html:not([data-theme="light"]) .sidebar{
  background:#36393f;
  border-right:1px solid #555a62;
  color:#f9fafb;
}
html:not([data-theme="light"]) .topbar{
  background:#36393f;
  border-bottom:1px solid #555a62;
  color:#f9fafb;
}
html:not([data-theme="light"]) input,
html:not([data-theme="light"]) select:not(.msg-deal-select),
html:not([data-theme="light"]) textarea{
  background:#303238;
  border-color:#555a62;
  color:#f9fafb;
}
html:not([data-theme="light"]) input::placeholder,
html:not([data-theme="light"]) textarea::placeholder{
  color:#667085;
}
html:not([data-theme="light"]) .btn:not(.primary):not(.danger):not(.good){
  background:#3b3e44;
  border-color:#555a62;
  color:#f9fafb;
}
html:not([data-theme="light"]) .btn:not(.primary):not(.danger):not(.good):hover{
  background:#45494f;
  border-color:#475467;
  color:#f9fafb;
}
html:not([data-theme="light"]) .btn.primary{
  color:#fff;
}
html:not([data-theme="light"]) .msg-col.card,
html:not([data-theme="light"]) .msg-chat.card,
html:not([data-theme="light"]) .msg-conv-list,
html:not([data-theme="light"]) .notifications-dropdown{
  background:#3b3e44;
  border-color:#555a62;
  color:#f9fafb;
}
html:not([data-theme="light"]) .table th{
  background:#303238;
  color:#98a2b3;
  font-weight:500;
  text-transform:none;
  border-bottom:1px solid #555a62;
}
html:not([data-theme="light"]) .table td{
  color:#f9fafb;
  border-color:#555a62;
}
html:not([data-theme="light"]) .nav a > span:not(.nav-msg-badge){
  background:rgba(152,162,179,.12);
  color:#98a2b3;
}
html:not([data-theme="light"]) .nav a.active > span:not(.nav-msg-badge){
  background:color-mix(in srgb, var(--brand) 22%, transparent);
  color:var(--brand);
}

/* —— TailAdmin pass 7: unify ALL pages (shell/forms/tables/chat/finance/modals) —— */
.main-body{
  gap:24px;
}
.main-body > h1,
.page-title,
.orders-page-head__title,
.admin-dashboard h1{
  font-weight:700;
  letter-spacing:-.025em;
  color:var(--text);
}
/* Radius ladder: cards 16 / controls 8 */
.btn,
.btn.small,
.btn.btn-outline,
.btn.btn-neon-violet,
.filter-toggle-btn,
.crm-pagination .btn,
.crm-section-tab,
.price-matrix-tabs .btn,
.orders-page-head__actions .btn{
  border-radius:var(--radius-sm,8px) !important;
}
.card,
.table-wrap,
.msg-col.card,
.msg-chat.card,
.msg-channel-bar,
.flash,
.notifications-dropdown,
.crm-dialog,
dialog.crm-dialog,
.metric-pill,
.attention-chip,
.orders-kpi,
.admin-dashboard .orders-kpi,
.admin-dashboard .chart-card,
.admin-dashboard .service-item{
  border-radius:var(--radius) !important;
}
/* Tables everywhere: sentence case thead, muted */
.table th,
.orders-page .orders-table thead th,
.editors-table-compact th,
.finance-page table th,
.ledger-page table th{
  text-transform:none !important;
  letter-spacing:0 !important;
  font-weight:500 !important;
  font-size:12px !important;
  color:var(--muted) !important;
  background:var(--surface-inset) !important;
  border-color:var(--line) !important;
}
.table td,
.orders-page .orders-table tbody td{
  color:var(--text);
  border-color:var(--line);
}
/* Segmented tabs like TailAdmin */
.crm-section-tabs,
.price-matrix-tabs,
.dashboard-period-presets,
.ai-seg{
  background:var(--surface-inset);
  border:1px solid var(--line);
  border-radius:var(--radius-sm,8px);
  padding:4px;
}
.crm-section-tabs .btn.active,
.crm-section-tab.is-active,
.price-matrix-tabs .btn.active,
.ai-seg .btn.is-active{
  background:var(--card-bg) !important;
  color:var(--brand) !important;
  border-color:transparent !important;
  box-shadow:var(--shadow);
}
html[data-theme="light"] .crm-section-tabs .btn.active,
html[data-theme="light"] .crm-section-tab.is-active,
html[data-theme="light"] .price-matrix-tabs .btn.active,
html[data-theme="light"] .ai-seg .btn.is-active{
  background:#fff !important;
  color:var(--brand) !important;
}
/* Flash / alerts on tokens */
.flash{
  border:1px solid var(--line);
  background:var(--card-bg);
  color:var(--text);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.flash.success,
.flash.ok{
  background:var(--surface-success-soft);
  border-color:color-mix(in srgb, var(--brand) 35%, var(--line));
  color:var(--st-completed);
}
.flash.error,
.flash.danger{
  background:var(--surface-danger-soft);
  border-color:color-mix(in srgb, var(--danger) 35%, var(--line));
  color:var(--st-returned);
}
.flash.warn,
.flash.warning{
  background:color-mix(in srgb, var(--warn) 12%, transparent);
  border-color:color-mix(in srgb, var(--warn) 35%, var(--line));
  color:var(--warn);
}
/* Pagination / filter chrome */
.crm-pagination,
.crm-filter-actions,
.orders-mass-bar,
.msg-list-tools{
  background:var(--surface-inset);
  border-color:var(--line);
  color:var(--text);
}
/* Soft status pills (orders / deals) */
.status-pill,
.order-status,
.badge,
.metric-pill,
.attention-chip{
  border-radius:999px;
  font-weight:500;
}
/* Finance / admin / editor / settings cards share shell */
.finance-page .card,
.ledger-page .card,
.expenses-page .card,
.admin-dashboard .card,
.editor-home-dashboard .card,
.price-page .card,
.settings-page .card,
.users-page .card,
.contests-admin-page .card,
.black-banana-page .card,
.bb-studio__form{
  background:var(--card-bg);
  border:1px solid var(--line);
  color:var(--text);
  box-shadow:var(--shadow);
}
/* Forms: consistent field chrome */
.field label,
.form-label,
label.small{
  color:var(--muted);
  font-weight:500;
  font-size:13px;
}
.field input,
.field select:not(.msg-deal-select),
.field textarea,
.card input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
.card select:not(.msg-deal-select),
.card textarea{
  background-color:var(--input-bg);
  border:1px solid var(--line);
  color:var(--text);
  border-radius:var(--radius-sm,8px);
}
/* Status-colored deal select: только цвет фона, без сброса background-image */
.card select.msg-deal-select,
.field select.msg-deal-select{
  border:1px solid var(--line);
  border-radius:999px;
}
/* Login / guest also on tokens */
.app--guest-login,
.login-card,
.login-wrap .card{
  background:var(--card-bg);
  border-color:var(--line);
  color:var(--text);
}
/* Kill leftover neon / heavy lifts */
.btn.btn-neon-violet,
.btn.btn-outline{
  box-shadow:none !important;
}
.editor-rankings-grid .rank-chip__num{
  text-shadow:none !important;
  box-shadow:none !important;
}
/* Chat bubbles: brand out / soft in (TailAdmin chat) */
.msg-bubble--out{
  background:var(--msg-out-bg) !important;
  color:var(--msg-out-text) !important;
}
.msg-bubble--in{
  background:var(--msg-in-bg) !important;
  color:var(--text) !important;
}
html[data-theme="light"] .msg-bubble--in{color:#303238 !important}
.msg-bubble-checks--read::before,
.msg-bubble-checks--read::after{
  color:var(--brand) !important;
}
/* Empty states / muted helpers */
.empty-state{color:var(--muted)}
.empty-state .empty-state-title{color:var(--text)}
code,kbd{
  background:var(--surface-inset);
  border:1px solid var(--line);
  color:var(--text);
  border-radius:6px;
}
/* Ensure contrast: never invisible text on soft brand */
.nav a.active,
.btn-group .btn.active{
  color:var(--brand) !important;
}
.btn.primary,
.btn.primary:hover,
a.btn.primary,
a.btn.primary:hover,
html[data-theme="light"] .btn.primary,
html[data-theme="light"] .btn.primary:hover,
html[data-theme="light"] a.btn.primary,
html[data-theme="light"] a.btn.primary:hover,
.topbar .btn.primary,
.topbar a.btn.primary,
.topbar-actions .btn.primary,
.topbar-editors-actions .btn.primary{
  background:var(--brand) !important;
  border-color:var(--brand) !important;
  color:#fff !important;
  opacity:1 !important;
}
.btn.primary:hover,
a.btn.primary:hover,
html[data-theme="light"] .btn.primary:hover,
html[data-theme="light"] a.btn.primary:hover,
.topbar .btn.primary:hover,
.topbar a.btn.primary:hover{
  background:var(--brand2) !important;
  border-color:var(--brand2) !important;
  color:#fff !important;
}

/* —— TailAdmin pass 8: visible shell + editors/tables (no logic change) —— */
html[data-theme="light"]{
  --bg:#f2f4f7;
  --shadow:0 1px 3px rgba(16,24,40,.06);
}
html[data-theme="light"] body,
html[data-theme="light"] .main-body{
  background:#f2f4f7;
}
html[data-theme="light"] .card,
html[data-theme="light"] .table-wrap,
html[data-theme="light"] .crm-panel-soft{
  background:#fff;
  border:1px solid #e4e7ec;
  box-shadow:0 1px 3px rgba(16,24,40,.06);
}
html[data-theme="light"] .topbar{
  background:#fff;
  border-bottom:1px solid #e4e7ec;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
html[data-theme="light"] .crm-section-tabs{
  background:#fff;
  border:1px solid #e4e7ec;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
  padding:6px;
  gap:4px;
}
html[data-theme="light"] .crm-section-tab.is-active{
  background:#ecfdf3 !important;
  color:#039855 !important;
  font-weight:600;
}
.table.compact td,
.editors-table-compact td,
.table.compact th,
.editors-table-compact th{
  padding:12px 14px !important;
  vertical-align:middle;
}
.table tbody tr:hover td{
  background:color-mix(in srgb, var(--brand) 4%, transparent);
}
.btn.small{
  min-height:32px;
  padding:6px 12px;
  font-weight:500;
}
.btn.small.danger,
.btn.danger{
  background:var(--surface-danger-soft) !important;
  border:1px solid color-mix(in srgb, var(--danger) 40%, var(--line)) !important;
  color:var(--st-returned) !important;
}
.badge.ok{
  background:var(--surface-success-soft);
  border-color:color-mix(in srgb, var(--brand) 35%, var(--line));
  color:var(--st-completed);
}
.badge.muted{
  background:var(--surface-inset);
  border-color:var(--line);
  color:var(--muted);
}
.badge.warn{
  background:color-mix(in srgb, var(--warn) 12%, transparent);
  border-color:color-mix(in srgb, var(--warn) 35%, var(--line));
  color:var(--st-active);
}
.crm-panel-soft .card-b,
.crm-panel-soft{
  color:var(--text);
}
.topbar-actions .btn,
.topbar-editors-actions .btn{
  font-weight:500;
}
.topbar-actions .btn.primary,
.topbar-editors-actions .btn.primary{
  font-weight:600;
  box-shadow:0 1px 2px rgba(18,183,106,.25);
}
html:not([data-theme="light"]) .btn.primary,
html:not([data-theme="light"]) a.btn.primary{
  background:#12b76a !important;
  border-color:#12b76a !important;
  color:#fff !important;
}
html:not([data-theme="light"]) .main-body{
  background:var(--bg);
}

/* Мобилка: чуть плотнее gap (не трогаем чаты — у них gap:0) */
@media (max-width:720px){
  .main:not(:has(#msg-inbox)) > .main-body{gap:12px;padding-left:14px;padding-right:14px}
  .topbar{min-height:56px;padding:10px 14px}
  .app:not(.app--guest-login) .topbar{min-height:0;padding:4px 10px}
}
