/* КЛАССИКА: только классический интерфейс (плоский вид, телефон, планшет, ПК, модалки классики). */


/* ===== Оболочка ===== */
.topbar {
  position: sticky; top: 0; z-index: 60;
  height: var(--topbar-h);
  display: flex; align-items: center; gap: 14px;
  padding: 0 24px 0 12px;
  background: rgba(255, 255, 255, .86);
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid var(--line);
}

.brand { display: inline-flex; align-items: center; gap: 11px; font-weight: 700; font-size: 17px; letter-spacing: -.02em; }

.brand-mark {
  width: 34px; height: 34px; display: grid; place-items: center;
  border-radius: 10px; color: #fff; font-weight: 800;
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  box-shadow: 0 4px 12px rgba(37, 99, 235, .35);
}

.topbar-title { flex: 1; min-width: 0; color: var(--muted); font-size: 14px; padding-left: 14px; margin-left: 4px; border-left: 1px solid var(--line); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.topbar-actions { display: flex; align-items: center; gap: 6px; margin-left: auto; }

.topbar-actions form { margin: 0; }

.topbar .nav-toggle { display: none; }


.app-layout { display: flex; align-items: flex-start; min-height: calc(100vh - var(--topbar-h)); }

.sidebar {
  position: sticky; top: var(--topbar-h);
  flex: 0 0 var(--sidebar-w); width: var(--sidebar-w);
  height: calc(100vh - var(--topbar-h)); overflow-y: auto;
  padding: 20px 14px 28px;
  background: var(--surface);
  border-right: 1px solid var(--line);
  overscroll-behavior: contain;
}

.nav-label { padding: 0 12px; margin: 18px 0 8px; color: var(--faint); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.nav-label:first-child { margin-top: 0; }

.nav-item {
  position: relative; display: flex; align-items: center; gap: 12px;
  margin-bottom: 2px; padding: 10px 12px;
  border-radius: 10px; color: var(--text-2); font-size: 14.5px; font-weight: 500;
  transition: background .15s, color .15s;
}

.nav-item .i { color: var(--faint); transition: color .15s; }

a.nav-item:hover { background: var(--surface-3); color: var(--text); }

a.nav-item:hover .i { color: var(--text-2); }

.nav-item.active { background: var(--primary-soft); color: var(--primary); font-weight: 620; }

.nav-item.active .i { color: var(--primary); }

.nav-item.is-soon { opacity: .55; cursor: default; }

.sidebar-backdrop { display: none; }

.login-card .brand-mark { width: 44px; height: 44px; margin-bottom: 24px; border-radius: 13px; font-size: 20px; }

@media (max-width: 900px) {
  .topbar .nav-toggle { display: inline-flex; margin-left: -6px; }

  .topbar { padding: 0 14px; gap: 8px; }

  .topbar-title { display: none; }

  .topbar-actions .btn span { display: none; }

  .topbar-actions .btn { width: 40px; padding: 0; }

  .sidebar {
    position: fixed; z-index: 8000; top: 0; left: 0; bottom: 0; height: 100dvh; width: min(300px, 86vw); flex: none;
    padding-top: calc(20px + env(safe-area-inset-top)); transform: translateX(-102%); transition: transform .3s var(--ease); box-shadow: none;
  }

  html.nav-open .sidebar { transform: none; box-shadow: var(--sh-pop); }

  .sidebar-backdrop { display: block; position: fixed; inset: 0; z-index: 7999; background: rgba(15, 23, 42, .45); opacity: 0; pointer-events: none; transition: opacity .25s; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }

  html.nav-open .sidebar-backdrop { opacity: 1; pointer-events: auto; }
}


/* логотип (белый на прозрачном — всегда на тёмной плашке) */
.brand { padding: 0; }

.brand-logo { display: block; height: 22px; width: auto; padding: 9px 16px; box-sizing: content-box; border-radius: 12px; background: linear-gradient(135deg, #0f1626, #1c2740); box-shadow: 0 2px 8px rgba(15, 22, 38, .25); transition: transform .2s var(--ease), box-shadow .2s; }

.brand:hover .brand-logo { transform: translateY(-1px); box-shadow: 0 5px 14px rgba(15, 22, 38, .3); }

@media (max-width: 900px) {
 .brand-logo { height: 18px; padding: 8px 12px; }
}

@media (min-width: 901px) {
 .topbar:has(.mode-switch.in-top) { padding-right: 12px; }
}

.topbar-actions { margin-left: 0; }

.topbar-title { flex: 1; }

@media (max-width: 1180px) and (min-width: 901px) {
 .topbar-title { display: none; }
 .topbar-actions .btn span { display: none; }
 .topbar-actions .btn { width: 40px; padding: 0; }
}


/* Боковое меню: настройки внизу, раскрываемая группа */
.sidebar { display: flex; flex-direction: column; }

.nav-fold { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--line); }

.nav-fold-head { list-style: none; display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; color: var(--text-2); font-weight: 600; font-size: 14px; cursor: pointer; user-select: none; }

.nav-fold-head::-webkit-details-marker { display: none; }

.nav-fold-head:hover { background: var(--surface-3); color: var(--text); }

.nav-fold-head .i:first-child { color: var(--faint); }

.nav-fold-head span { flex: 1; }

.nav-fold-arrow { transition: transform .2s; color: var(--faint); }

.nav-fold[open] .nav-fold-arrow { transform: rotate(180deg); }

.nav-fold .nav-sub { margin-left: 8px; font-size: 13.5px; }

.nav-label-soon { margin-top: 22px; }

.nav-chat { width: 100%; background: none; border: 0; text-align: left; cursor: pointer; font: inherit; color: inherit; position: relative; }

.nav-chat .chat-count { margin-left: auto; }

body.chat-docked .app-layout { padding-right: var(--chat-w); transition: padding .2s; }

@media (max-width: 900px) {
  body.chat-docked .app-layout { padding-right: 0; }
}


/* аватарки */
.top-av {width:24px;height:24px;border-radius:50%;object-fit:cover;display:block}

@media (min-width: 901px) {
  body.chat-docked .app-layout { padding-right: 0; margin-right: var(--chat-w); height: calc(100vh - var(--topbar-h)); min-height: 0; overflow-y: auto; overflow-x: hidden; scrollbar-gutter: stable; transition: margin .2s; }

  body.chat-docked .sidebar { top: 0; }
}


/* редактор во всплывающем окне (iframe ?embed=1) */
html.is-embed:where(:not(.in-os)) .topbar,
html.is-embed:where(:not(.in-os)) .sidebar,
html.is-embed:where(:not(.in-os)) .back-link,
html.is-embed:where(:not(.in-os)) .chat-panel,
html.is-embed:where(:not(.in-os)) .sidebar-backdrop { display: none !important; }

html.is-embed:where(:not(.in-os)) .app-layout { display: block; min-height: 0; }

html.is-embed:where(:not(.in-os)) .page { padding: 14px 16px 90px; max-width: none; }

html.is-embed:where(:not(.in-os)) .ed-bar { left: 0; }

html.is-embed:where(:not(.in-os)) [data-editor-history] { display: none !important; }

/* Окно рабочего стола: список не сжимает название — при нехватке ширины появляется прокрутка. */
html.is-embed:where(:not(.in-os)) .list {overflow-x:auto}

html.is-embed:where(:not(.in-os)) .list-head,
html.is-embed:where(:not(.in-os)) .list-row {min-width:980px}

html.is-embed:where(:not(.in-os)) .form-bar {position:sticky;bottom:0;z-index:20;margin:18px -16px 0;padding:12px 18px;background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) {display:grid;grid-template-columns:216px minmax(0,1fr);padding:0 16px 0 0;align-content:start;min-height:100vh;max-width:none}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > .set-tabs {grid-column:1;grid-row:1 / span 60;position:sticky;top:0;align-self:start;height:100vh;flex-direction:column;flex-wrap:nowrap;margin:0;padding:14px 10px;gap:3px;border-right:1px solid var(--line);background:var(--surface-2);overflow-y:auto}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > .set-tabs a {border:0;background:transparent;border-radius:9px;padding:9px 12px;white-space:nowrap}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > .set-tabs a:hover {background:#e9edf5}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > .set-tabs a.is-active {background:var(--primary-soft)}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > :not(.set-tabs) {grid-column:2;margin-left:22px}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs)::before {content:"";grid-column:2;grid-row:1;height:16px;display:block}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > .notice {margin-top:0}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > form {display:flex;flex-direction:column;min-height:calc(100vh - 16px)}

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) .form-bar {margin:auto -16px 0 -22px;padding-left:22px}

html.is-embed:where(:not(.in-os)).has-treepane .page {display:grid;grid-template-columns:236px minmax(0,1fr);padding:0 16px 40px 0;max-width:none;align-content:start;min-height:100vh}

html.is-embed:where(:not(.in-os)).has-treepane .page > :not(.tree-pane) {grid-column:2;margin-left:18px}

html.is-embed:where(:not(.in-os)).has-treepane .page > .list {margin-top:14px}

html.is-embed:where(:not(.in-os)) .list-head,
html.is-embed:where(:not(.in-os)) .list-row {min-width:0;gap:10px;padding-left:14px;padding-right:14px}
html.is-embed:where(:not(.in-os)) .list-date {white-space:normal}
html.is-embed:where(:not(.in-os)) body {overflow-x:hidden}
html.is-embed:where(:not(.in-os)) img,
html.is-embed:where(:not(.in-os)) table {max-width:100%}


/* мессенджер: сообщения, меню, реакции */
html.is-embed:where(:not(.in-os)) .messenger-app .chat-head::before { display: none; }

.topbar { background: var(--os-grad); border-bottom: 0; color: #fff; box-shadow: 0 2px 14px hsl(var(--h-a) 46% 42% / .28); }

.topbar .brand { color: #fff; }

.topbar .brand-logo { background: none !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important; height: 26px; width: auto; filter: drop-shadow(0 1px 3px rgba(0,0,0,.25)); }

.topbar-title { color: rgba(255,255,255,.82); border-left-color: rgba(255,255,255,.28); }

.topbar .btn-ghost,
.topbar .nav-toggle { color: #fff; }

.topbar .btn-ghost:hover { background: rgba(255,255,255,.18); color: #fff; }

.topbar .i { stroke: currentColor; }

@media (max-width: 899px) {
  .topbar { padding: 0 12px; gap: 8px; }

  .topbar .brand-logo { height: 22px; }
}

@media (max-width: 899px) {
 .topbar [data-desktop-link] { display: inline-flex !important; }
 .topbar [data-desktop-link] span { display: none; }
}


/* ===== окна рабочего стола: красивое сжатие (ширина iframe = ширина окна) ===== */
@media (max-width: 1180px) {
  html.is-embed:where(:not(.in-os)) .list-row { grid-template-columns: 72px minmax(0,1fr) auto; grid-template-areas: "thumb main main" "thumb meta act"; gap: 6px 12px; align-items: center; padding: 12px 14px; }

  html.is-embed:where(:not(.in-os)) .list-row.no-thumb { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "main main" "meta act"; }

  html.is-embed:where(:not(.in-os)) .list-row > .c-thumb { grid-area: thumb; align-self: start; }

  html.is-embed:where(:not(.in-os)) .list-row > .c-main { grid-area: main; }

  html.is-embed:where(:not(.in-os)) .list-row > .c-meta { grid-area: meta; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; min-width: 0; }

  html.is-embed:where(:not(.in-os)) .list-row > .c-actions { grid-area: act; justify-self: end; }

  html.is-embed:where(:not(.in-os)) .list-row .list-actions { justify-content: flex-end; flex-wrap: nowrap; }

  html.is-embed:where(:not(.in-os)) .list-row .list-actions .btn,
html.is-embed:where(:not(.in-os)) .list-row .list-actions form { flex: none; }

  html.is-embed:where(:not(.in-os)) .list-row .list-actions form .btn { width: auto; }

  html.is-embed:where(:not(.in-os)) .list-row .list-actions .btn-icon { width: 34px; }

  html.is-embed:where(:not(.in-os)) .list-row .c-meta > * { white-space: normal; }
}

@media (max-width: 520px) {
  html.is-embed:where(:not(.in-os)) .list-row { grid-template-columns: 72px minmax(0,1fr); grid-template-areas: "thumb main" "meta meta" "act act"; }

  html.is-embed:where(:not(.in-os)) .list-row.no-thumb { grid-template-columns: minmax(0,1fr); grid-template-areas: "main" "meta" "act"; }

  html.is-embed:where(:not(.in-os)) .list-row > .c-actions { justify-self: stretch; }

  html.is-embed:where(:not(.in-os)) .list-row .list-actions { justify-content: flex-start; flex-wrap: wrap; }
}

@media (max-width: 720px) {
  html.is-embed:not(.in-os) .page:has(> .set-tabs) { display: block; padding: 0 14px 40px; min-height: 0; }

  html.is-embed:not(.in-os) .page:has(> .set-tabs) > .set-tabs { position: sticky; top: 0; z-index: 6; height: auto; flex-direction: row; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; margin: 0 -14px 14px; padding: 8px 12px; border-right: 0; border-bottom: 1px solid var(--line); gap: 6px; }

  html.is-embed:not(.in-os) .page:has(> .set-tabs) > .set-tabs a { flex: none; padding: 7px 12px; border: 1px solid var(--line); background: var(--surface); }

  html.is-embed:not(.in-os) .page:has(> .set-tabs) > .set-tabs a.is-active { background: var(--primary-soft); border-color: transparent; }

  html.is-embed:not(.in-os) .page:has(> .set-tabs) > .set-tabs .set-group { display: none; }

  html.is-embed:not(.in-os) .page:has(> .set-tabs) > :not(.set-tabs) { margin-left: 0; }

  html.is-embed:not(.in-os) .page:has(> .set-tabs) > form { min-height: 0; }

  html.is-embed:not(.in-os) .page:has(> .set-tabs) .form-bar { margin: 18px -14px 0; padding-left: 14px; }

  html.is-embed:not(.in-os).has-treepane .page { display: block; padding: 0 14px 40px; min-height: 0; }

  html.is-embed:not(.in-os).has-treepane .page > :not(.tree-pane) { margin-left: 0; }

  html.is-embed:not(.in-os).has-treepane .tree-pane { position: sticky; top: 0; z-index: 6; height: auto; display: flex; flex-wrap: nowrap; align-items: center; gap: 6px; overflow-x: auto; overflow-y: hidden; border-right: 0; border-bottom: 1px solid var(--line); margin: 0 -14px 12px; padding: 8px 12px; }

  html.is-embed:not(.in-os).has-treepane .tree-pane h3 { display: none; }

  html.is-embed:not(.in-os).has-treepane .tree-pane button { width: auto; flex: none; white-space: nowrap; padding: 6px 12px !important; border: 1px solid var(--line); background: var(--surface); }

  html.is-embed:not(.in-os).has-treepane .tree-pane button.is-active { background: var(--primary-soft); border-color: transparent; }

  html.is-embed:not(.in-os).has-treepane .tree-pane .tp-open { margin: 0; }

  html.is-embed:not(.in-os) .page { padding-left: 12px; padding-right: 12px; }
}


/* в окнах рабочего стола заголовок страницы скрыт, но кнопки действий («Создать», «Добавить») остаются */
html.is-embed:where(:not(.in-os)) .page-head {margin-bottom:14px;justify-content:flex-end;align-items:center}

html.is-embed:where(:not(.in-os)) .page-head > div:first-child:not(.page-head-actions) {display:none}

html.is-embed:where(:not(.in-os)) .page-head:not(:has(a.btn,button.btn,.page-head-actions)) {display:none}

html.is-embed:where(:not(.in-os)) .page-head .btn-create {white-space:nowrap}

@media (max-width:520px) {
html.is-embed:where(:not(.in-os)) .page-head {justify-content:stretch}
html.is-embed:where(:not(.in-os)) .page-head > .btn,
html.is-embed:where(:not(.in-os)) .page-head-actions {flex:1}
}


html.is-embed:where(:not(.in-os)) .cs-page {padding:12px 14px 14px;height:100vh;display:flex}

@media (max-width: 900px) {
html.is-embed:where(:not(.in-os)) .list-row > .c-actions { justify-self: stretch; width: 100%; }

html.is-embed:where(:not(.in-os)) .list-row .list-actions { justify-content: flex-start; flex-wrap: nowrap; width: 100%; }

html.is-embed:where(:not(.in-os)) .list-row .list-actions .btn { flex: none; }

html.is-embed:where(:not(.in-os)) .list-row .list-actions form { flex: none; }

html.is-embed:where(:not(.in-os)) .list-row .list-actions form .btn { width: 40px; }

html.is-embed:where(:not(.in-os)) .list-row .list-actions .btn-icon { width: 40px; }
}

@media (min-width: 521px) and (max-width: 900px) {
  html.is-embed:where(:not(.in-os)) .list-row { grid-template-columns: 72px minmax(0,1fr); grid-template-areas: "thumb main" "thumb meta" "thumb act"; }

  html.is-embed:where(:not(.in-os)) .list-row.no-thumb { grid-template-columns: minmax(0,1fr); grid-template-areas: "main" "meta" "act"; }

  html.is-embed:where(:not(.in-os)) .list-row > .c-actions { justify-self: stretch; }
}

html.is-embed:where(:not(.in-os)) .osb-pageload::after { content: ""; position: fixed; left: 50%; top: 50%; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; border: 3px solid rgba(120,130,150,.3); border-top-color: var(--primary, #2563eb); animation: osb-spin .8s linear infinite; }

html.is-embed:where(:not(.in-os)) .cs-inline .osb-x { display: none; }


/* единый вертикальный список разделов и в обычном режиме */
@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) {display:grid;grid-template-columns:216px minmax(0,1fr);padding:0;align-content:start;min-height:0;max-width:none}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) > .set-tabs {grid-column:1;grid-row:1 / span 60;position:sticky;top:12px;align-self:start;height:calc(100vh - 24px);flex-direction:column;flex-wrap:nowrap;margin:0;padding:14px 10px;gap:3px;border-right:1px solid var(--line);background:var(--surface-2);overflow-y:auto}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) > .set-tabs a {border:0;background:transparent;border-radius:9px;padding:9px 12px;white-space:nowrap}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) > .set-tabs a:hover {background:#e9edf5}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) > .set-tabs a.is-active {background:var(--primary-soft)}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) > :not(.set-tabs) {grid-column:2;margin-left:22px}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) > .set-tabs ~ :not(.notice):first-of-type {margin-top:16px}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) > .notice {margin-top:14px}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) > form {display:flex;flex-direction:column;min-height:calc(100vh - 16px)}
}

@media (min-width:721px) {
html:not(.is-embed) .page:has(> .set-tabs) .form-bar {margin:auto -16px 0 -22px;padding-left:22px}
}

/* чат внутри окна ОС: без собственного названия и кнопок «закрыть/на весь экран» (ими управляет окно) */
html.is-embed:where(:not(.in-os)) .messenger-app .chat-head [data-act="close"],
html.is-embed:where(:not(.in-os)) .messenger-app .chat-head [data-act="full"] { display: none !important; }

html.is-embed:where(:not(.in-os)) .messenger-app .chat-panel { display: flex !important; }

/* контент не прилипает к верху окна */
html.is-embed:where(:not(.in-os)):not(.is-modal) .page:not(:has(> .set-tabs)) { padding-top: 16px; }

html.is-embed:where(:not(.in-os)).has-treepane .page { padding-top: 16px; }

/* полосы прокрутки в боковых меню окон видны (тонкие) */
html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > .set-tabs,
html.is-embed:where(:not(.in-os)) .tree-pane { scrollbar-width: thin !important; scrollbar-color: rgba(110,118,140,.45) transparent; }

html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > .set-tabs::-webkit-scrollbar,
html.is-embed:where(:not(.in-os)) .tree-pane::-webkit-scrollbar { display: block !important; width: 8px; }


/* окна ОС: кнопки формы закреплены вне области прокрутки — полоса прокрутки не заходит на панель */
html.is-embed:where(:not(.in-os)).fs-bar { overflow: hidden !important; }

html.is-embed:where(:not(.in-os)).fs-bar body { height: calc(100vh - var(--fbh, 64px)); overflow-y: auto; overflow-x: hidden; }

html.is-embed:where(:not(.in-os)).fs-bar .form-bar { position: fixed !important; left: var(--fbl, 0); right: 0; bottom: 0; margin: 0 !important; z-index: 30; }

html.is-embed:where(:not(.in-os)).fs-bar .page:has(> .set-tabs) > .set-tabs,
html.is-embed:where(:not(.in-os)).fs-bar .tree-pane { height: calc(100vh - var(--fbh, 64px)); }

html.is-embed:where(:not(.in-os)).fs-bar .page:has(> .set-tabs) { min-height: calc(100vh - var(--fbh, 64px)); }

html.is-embed:where(:not(.in-os)).fs-bar .page:has(> .set-tabs) > form { min-height: 0; }

/* плоский вид: панель кнопок — фиксированная полоса внизу области контента (над нижним меню на телефоне), контент прокручивается до неё */
html.fs-bar:not(.is-embed) .form-bar { position: fixed !important; left: var(--fbl, 0); right: var(--fbr, 0); bottom: var(--tabbar-h, 0px) !important; margin: 0 !important; z-index: 60; border-radius: 0; }

html.fs-bar:not(.is-embed) main.page { padding-bottom: calc(var(--fbh, 64px) + 24px) !important; }

/* в дочернем модальном окне OSBOS навигация модуля не нужна */
html.is-modal:where(:not(.in-os)) .mod-title,
html.is-modal:where(:not(.in-os)) .page > .set-tabs,
html.is-modal:where(:not(.in-os)) .sc-arr { display: none !important; }

html.is-embed:where(:not(.in-os)) .cs-page { padding: 0 !important; height: 100vh; display: flex; }

/* серая пустота под боковым списком разделов: список тянется на всю высоту окна, панель кнопок стоит правее него */
html.is-embed:where(:not(.in-os)).fs-bar .page:has(> .set-tabs) > .set-tabs,
html.is-embed:where(:not(.in-os)).fs-bar .tree-pane { height: 100vh !important; }

html.is-embed:where(:not(.in-os)).fs-bar .page:has(> .set-tabs) { min-height: 100vh !important; }

html.is-embed:where(:not(.in-os)).fs-bar:has(.page > .set-tabs) body { height: 100vh !important; }

html.is-embed:not(.in-os).fs-bar:has(.page > .set-tabs) body { height: calc(100vh - var(--fbh, 64px)) !important; }

html:not(.is-embed) .cs-inline { min-height: calc(100dvh - 190px); }


/* дерево категорий товаров (окно/широкий экран): без зазоров сверху/снизу, высота = окно, лишней прокрутки нет */
@media (min-width: 721px) {
  html.is-embed:where(:not(.in-os)).has-treepane .page { padding: 0 16px 0 0 !important; min-height: 0 !important; }

  html.is-embed:where(:not(.in-os)).has-treepane .page > .list,
html.is-embed:where(:not(.in-os)).has-treepane .page > .page-head { margin-top: 16px; }

  html.is-embed:where(:not(.in-os)).has-treepane .page > .form-bar { margin-left: 0 !important; }

  html.is-embed:where(:not(.in-os)).fs-bar.has-treepane body { height: 100vh !important; }

  html.is-embed:where(:not(.in-os)).fs-bar.has-treepane .page::after { content: ''; grid-column: 2; display: block; height: calc(var(--fbh, 64px) + 12px); }

  html.is-embed:where(:not(.in-os)).has-treepane .tree-pane { height: 100vh !important; padding-bottom: calc(var(--fbh, 0px) + 12px); box-sizing: border-box; }
}


/* боковое меню/дерево занимает 60 строк сетки: лишняя высота уходит только в последнюю гибкую строку, иначе страница становится выше окна и появляется лишняя прокрутка */
@media (min-width: 721px) {
  html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs),
html.is-embed:where(:not(.in-os)).has-treepane .page,
html:not(.is-embed) .page:has(> .set-tabs) { grid-template-rows: repeat(59, auto) minmax(0, 1fr); }
}


/* плоский режим (ПК/планшет): список разделов не выше свободной части окна под шапкой; лишней прокрутки нет */
@media (min-width: 721px) {
  html:not(.is-embed) .page:has(> .set-tabs) > .set-tabs { height: calc(100vh - var(--topbar-h, 60px) - 12px); height: calc(100dvh - var(--topbar-h, 60px) - 12px); }

  html.fs-bar:not(.is-embed) main.page:has(> .set-tabs) { padding-bottom: 0 !important; }

  html.fs-bar:not(.is-embed) main.page:has(> .set-tabs)::after { content: ''; grid-column: 2; display: block; height: calc(var(--fbh, 64px) + 12px); }
}

/* ===== отклик на нажатие: прелоадер вместо иконки на нажатой кнопке/ссылке (js/classic/busy.js) ===== */
.is-wait { pointer-events: none; }
.busy-hide { display: none !important; }
.busy-spin { display: inline-block; flex: none; width: 18px; height: 18px; box-sizing: border-box; border-radius: 50%; border: 2.5px solid currentColor; border-top-color: transparent; opacity: .85; animation: busy-rot .7s linear infinite; }
.tab .busy-spin { width: 24px; height: 24px; margin: 0 auto; }
.nav-item .busy-spin { width: 20px; height: 20px; }
.btn-primary .busy-spin { color: #fff; }
.set-tabs a .busy-spin { width: 16px; height: 16px; }
@keyframes busy-rot { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .busy-spin { animation-duration: 1.6s; } }

/* развёрнутый чат — выше нижней панели кнопок формы/списка (.form-bar), стрелки «вверх» и прочего: ничего не перекрывает поле ввода */
html:not(.is-embed) .chat-panel.is-full { z-index: 90 !important; }
html:not(.is-embed):has(.chat-panel.is-full:not([hidden])) .fab-top { display: none !important; }

/* Окна изменения во встроенном виде: отступы редактора */
html.is-embed:where(:not(.in-os)).is-modal .page.page-editor { padding: 14px 16px 24px; }

html.is-embed:where(:not(.in-os)) .ed-bar { left: var(--fbl, 0); }
html.is-embed:where(:not(.in-os)) .page:has(> .set-tabs) > .ed-bar { margin-left: 0 !important; }

.nav-item.is-off { opacity: .45; cursor: not-allowed; filter: grayscale(1); }

/* Классика: ссылка «назад» в редакторе остаётся на месте при прокрутке формы */
html:not(.is-embed) .page-editor > .back-link { position: sticky; top: 10px; z-index: 6; align-self: flex-start; background: rgba(255, 255, 255, .86); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-radius: 999px; padding: 6px 14px 6px 8px; box-shadow: 0 1px 6px rgba(0, 0, 0, .08); }