/* ============================================================================
   Редактор статьи (views/articles/form.php) – одна колонка по центру шириной 56rem, по бокам ничего
   (UI-KIT: студент, редактор, статья – одна ширина). Текст статьи – «лист»: полоса набора (--sh-tw)
   и шрифт книги в масштабе экрана, поля листа поровну слева и справа. Скругления – только --sb-radius
   (5 px, поля и кнопки) и --sb-radius-lg (6 px, карточки и окна); кегли – 20 / 17 / 15 / 14 / 13 px.
   ========================================================================== */

.sb-ed { width: 100%; max-width: 56rem; margin: 0 auto; }
.sb-ed .sb-ed-layout { display: block; }
.sb-ed-back { margin: -.75rem 0 .25rem; }

/* ---- верхняя строка: «Сохранено · 2,2 из 4 стр. · Осталось 3 ▾» и кнопки – прилипает под шапкой ---- */
.sb-ed-bar {
  position: sticky; top: calc(var(--sb-header-h) + env(safe-area-inset-top)); z-index: 1010;
  display: flex; align-items: center; justify-content: space-between; gap: .375rem 1rem; flex-wrap: wrap;
  min-height: 50px; padding: .5rem 0; margin-bottom: 1.25rem; background: #fff;
}
/* белая полоса во всю ширину окна – тенью подложки: на ширину страницы не влияет, меню «Осталось» не обрезает */
.sb-ed-bar::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  box-shadow: 0 0 0 100vmax #fff, 0 1px 0 100vmax var(--sb-line); clip-path: inset(0 -100vmax -1px -100vmax);
}
/* руководитель и администратор: слева меню разделов – полоса не шире колонки, белой плашкой */
.sb-has-side .sb-ed-bar { padding: .375rem .75rem; border: 1px solid var(--sb-line); border-radius: var(--sb-radius-lg); }
.sb-has-side .sb-ed-bar::before { content: none; }
.sb-ed-status { display: flex; align-items: center; flex-wrap: wrap; min-width: 0; font-size: .8125rem; color: var(--sb-muted); line-height: 1.4; }
.sb-ed-status > * + *::before { content: "·"; margin: 0 .375rem; color: var(--sb-muted); font-weight: 400; }
.sb-ed-saved { white-space: nowrap; }
.sb-ed-saved.is-error { color: var(--sb-bad-ink); white-space: normal; }
.sb-ed-pages { white-space: nowrap; font-variant-numeric: tabular-nums; }
.sb-ed-pages.is-over { color: var(--sb-bad-ink); font-weight: 600; }
.sb-ed-pages.is-stale { opacity: .6; }
.sb-left { display: inline-flex; align-items: center; }
.sb-left-btn {
  display: inline-flex; align-items: center; gap: .25rem; min-height: 34px; padding: 0; border: 0; background: none;
  color: var(--sb-brand-700); font-weight: 700; font-size: .8125rem; white-space: nowrap;
}
.sb-left-btn:hover { color: var(--sb-brand-800); text-decoration: underline; text-underline-offset: .2em; }
.sb-left-btn .sb-chev { width: 1rem; height: 1rem; transition: transform .15s; }
.sb-left-btn[aria-expanded=true] .sb-chev { transform: rotate(180deg); }
.sb-left-btn[hidden], .sb-left-ok[hidden] { display: none; }
.sb-left-ok { display: inline-flex; align-items: center; gap: .25rem; color: var(--sb-ok-ink); font-weight: 600; white-space: nowrap; }
.sb-left-ok > .sb-ic { width: 1rem; height: 1rem; color: var(--sb-ok-icon); }
.sb-left-menu { min-width: 20rem; max-width: min(30rem, calc(100vw - 2rem)); padding: .375rem; max-height: min(60vh, 26rem); overflow-y: auto; }
.sb-left-menu .dropdown-item {
  display: block; min-height: 36px; padding: .5rem .625rem; border-radius: var(--sb-radius);
  font-size: .875rem; line-height: 1.4; color: var(--sb-ink); white-space: normal;
}
.sb-left-menu .dropdown-item.is-advice { color: var(--sb-muted); }
.sb-left-menu .dropdown-item.is-wait { color: var(--sb-muted); cursor: default; }
.sb-left-menu .dropdown-item:hover, .sb-left-menu .dropdown-item:focus { background: var(--sb-brand-50); color: var(--sb-ink); text-decoration: none; }
.sb-left-menu .dropdown-divider { margin: .25rem .5rem; }
.sb-ed-actions { gap: .125rem; flex-wrap: nowrap; margin-left: auto; }
.sb-ed-actions .btn { margin-left: .375rem; white-space: nowrap; }
.sb-ed-ic {
  display: inline-flex; align-items: center; gap: .3125rem; min-height: 34px; padding: 0 .375rem; border: 0; border-radius: var(--sb-radius);
  background: none; color: var(--sb-ink-2); font-size: .875rem; font-weight: 500; white-space: nowrap;
}
.sb-ed-ic:hover { background: var(--sb-page); color: var(--sb-ink); }
.sb-ed-ic > .sb-ic { width: 1.125rem; height: 1.125rem; }
.sb-ed-ic .sb-count { min-width: 1.25rem; height: 1.25rem; font-size: .8125rem; }
@media (max-width: 991.98px) {
  .sb-ed-ic, .sb-left-btn { min-height: 44px; }
  .sb-ed-ic { min-width: 44px; justify-content: center; }
  .sb-ed-ic > span:not(.sb-count) { display: none; }     /* планшет: «Просмотр» и «Чат» – значками, подписи – в title */
  .sb-left-menu .dropdown-item { min-height: 44px; padding-top: .6875rem; padding-bottom: .6875rem; }
}
@media (max-width: 767.98px) {
  .sb-ed-actions { display: none; }
  .sb-ed-bar { padding: .25rem 0; min-height: 0; margin-bottom: 1rem; }
  .sb-ed-status > * + *::before { margin: 0 .375rem; }
  /* на телефоне список – во всю ширину под верхней строкой */
  .sb-left-menu.show { position: fixed !important; inset: var(--left-top, calc(var(--sb-header-h) + env(safe-area-inset-top) + var(--ed-bar-h, 44px))) var(--sb-gutter) auto !important; transform: none !important; min-width: 0; width: auto; max-width: none; margin: 0 !important; }
}

/* нижняя панель на телефоне: «Просмотр» и «Чат» по тексту, «Отправить руководителю» – остальное, при нехватке места в две строки */
.sb-action-bar.sb-ed-pbar { grid-auto-flow: row; grid-template-columns: auto auto minmax(0, 1fr); }
.sb-ed-pbar .btn { white-space: normal; line-height: 1.2; }

/* ---- замечания руководителя: спокойный блок над полями ---- */
.sb-ed-notes .card-body { padding: 1.25rem; }
.sb-ed-notes-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; margin-bottom: .375rem; }
.sb-ed-notes-head h2 { margin: 0; font-size: .9375rem; }
.sb-ed-note { margin: 0; }
.sb-ed-note + .sb-ed-note { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--sb-line); }
.sb-ed-note figcaption { font-size: .8125rem; color: var(--sb-muted); margin-bottom: .125rem; }
.sb-ed-note blockquote { margin: 0; font-size: .875rem; line-height: 1.5; color: var(--sb-ink); }

/* ---- поля: подпись слева, под ней маленький живой счётчик; на телефоне – подпись над полем ---- */
.sb-ed-fields .card-body { display: grid; gap: .875rem; padding: 1.25rem; }
.sb-ed-row { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); column-gap: 1rem; align-items: start; border-radius: var(--sb-radius-lg); }
.sb-ed-label { padding-top: .4375rem; font-size: .875rem; font-weight: 700; line-height: 1.4; color: var(--sb-ink); }
.sb-ed-label label { font-weight: 700; margin: 0; }
.sb-ed-cnt { display: block; margin-top: .125rem; font-size: .8125rem; font-weight: 400; line-height: 1.35; color: var(--sb-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.sb-ed-cnt.is-ok { color: var(--sb-ok-ink); }
.sb-ed-cnt.is-ok::before { content: "✓\00a0"; color: var(--sb-ok-icon); }
.sb-ed-field { min-width: 0; }
.sb-ed-field textarea.sb-autosize[rows="1"] { min-height: 34px; }
.sb-ed-short { max-width: 12rem; }
/* строка авторов: середина строки (высота 24 px) – вровень с подписью «Авторы» */
.sb-ed-text { padding-top: .3125rem; font-size: .875rem; line-height: 1.4; }
/* ключевые слова «фишками»: высота как у остальных полей */
.sb-ed .ts-wrapper.form-control { min-height: 34px; }
.sb-ed .ts-wrapper .ts-control { min-height: 32px; padding: .1875rem .5rem; }
.sb-ed .ts-wrapper.multi.has-items .ts-control { padding: .1875rem .375rem 0; }
.sb-ed .ts-wrapper.multi .ts-control > div.item { min-height: 24px; margin: 0 .25rem .1875rem 0; padding: 0 0 0 .5rem; font-weight: 400; }
.sb-ed .ts-wrapper.plugin-remove_button .item .remove { width: 24px; min-height: 24px; }
@media (max-width: 991.98px) {
  .sb-ed-label { padding-top: .75rem; }
  .sb-ed-text { padding-top: 0; }                         /* «Добавить соавтора» – 44 px: середина строки вровень с подписью */
  .sb-ed-field textarea.sb-autosize[rows="1"] { min-height: 44px; }
  .sb-ed .ts-wrapper.form-control { min-height: 44px; }
  .sb-ed .ts-wrapper .ts-control { min-height: 42px; padding: .4375rem .625rem; }
  .sb-ed .ts-wrapper.multi .ts-control > div.item { min-height: 32px; }
  .sb-ed .ts-wrapper.plugin-remove_button .item .remove { width: 32px; min-height: 32px; }
}
@media (max-width: 767.98px) {
  .sb-ed-fields .card-body { gap: 1rem; padding: 1rem; }
  .sb-ed-row { grid-template-columns: minmax(0, 1fr); row-gap: .25rem; }
  .sb-ed-label { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0 .75rem; padding-top: 0; }
  .sb-ed-cnt { display: inline; margin: 0; }
  .sb-ed-text { padding-top: 0; }
  .sb-ed-short { max-width: none; }
}
/* пункт «Осталось» привёл к полю – поле мягко подсвечено */
.sb-ed-row.is-hl, .sb-ed-shell.is-hl, .sb-rl-item.is-hl, .sb-ed-refs-head.is-hl { animation: sb-ed-hl 2s ease-out; }
@keyframes sb-ed-hl {
  0%, 40% { background-color: var(--sb-brand-50); box-shadow: 0 0 0 .5rem var(--sb-brand-50); }
  100% { background-color: transparent; box-shadow: 0 0 0 .5rem transparent; }
}
.sb-ed-shell.is-hl { animation-name: sb-ed-hl-sheet; }
/* рисунок или таблица, к которым привёл пункт «Осталось» – рамка на пару секунд */
.sb-editor .is-hl-obj { animation: sb-ed-hl-obj 2s ease-out; }
@keyframes sb-ed-hl-obj { 0%, 40% { outline: 2px solid var(--sb-brand); outline-offset: 4px; } 100% { outline: 2px solid transparent; outline-offset: 4px; } }
@keyframes sb-ed-hl-sheet { 0%, 40% { box-shadow: 0 0 0 .25rem var(--sb-brand-100); } 100% { box-shadow: 0 0 0 .25rem transparent; } }

/* ---- авторы одной строкой: «Иванов И.И., Э-2101 · + Добавить соавтора» ---- */
.sb-au-list { display: flex; flex-wrap: wrap; align-items: center; row-gap: .125rem; }
.sb-au { display: inline-flex; align-items: center; min-height: 1.5rem; }
.sb-au + .sb-au::before, .sb-au + .sb-au-add::before { content: "·"; margin: 0 .5rem; color: var(--sb-muted); font-weight: 400; }
.sb-au-text { color: var(--sb-ink); }
.sb-au-edit { padding: 0; border: 0; background: none; font: inherit; color: var(--sb-ink); text-align: left; }
.sb-au-edit:hover { color: var(--sb-brand-700); text-decoration: underline; text-underline-offset: .2em; }
.sb-au-del { display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; margin-left: .125rem; padding: 0; border: 0; border-radius: var(--sb-radius); background: none; color: var(--sb-muted); }
.sb-au-del:hover { background: var(--sb-page); color: var(--sb-bad-ink); }
.sb-au-del > .sb-ic { width: .875rem; height: .875rem; }
.sb-au-add { min-height: 1.5rem; font-size: .875rem; }
.sb-au-add > .sb-ic { width: 1rem; height: 1rem; }
.sb-au-list + .sb-ed-sup { margin-top: .625rem; }
/* «Руководитель: [Петрова А.С. ▾]» – поиск по фамилии, выбор сохраняется сразу (п. 44); после отправки – строка (п. 45) */
.sb-ed-sup { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .5rem; margin: 0; font-size: .875rem; color: var(--sb-ink); }
.sb-ed-sup-k { color: var(--sb-ink); }
.sb-ed-sup-v { color: var(--sb-ink); }
.sb-ed-sup .sb-ed-sup-sel, .sb-ed-sup .ts-wrapper.sb-ed-sup-sel { width: 16rem; max-width: 100%; }
.sb-ed-sup .ts-wrapper.single .ts-control { cursor: pointer; }
.sb-ed-sup .ts-wrapper.single .ts-control > input { min-width: 4rem; }
.sb-ed-sup .ts-dropdown { min-width: 20rem; }
@media (max-width: 991.98px) { .sb-au-del { width: 2.75rem; height: 2.75rem; margin: -.625rem -.5rem -.625rem 0; } .sb-au-add { min-height: 44px; } }
@media (max-width: 767.98px) {
  .sb-ed-sup { flex-direction: column; align-items: stretch; }
  .sb-ed-sup .sb-ed-sup-sel, .sb-ed-sup .ts-wrapper.sb-ed-sup-sel { width: 100%; }
  .sb-ed-sup .ts-dropdown { min-width: 0; }
}

/* ---- текст статьи – лист сборника: полоса набора, шрифт и кегль книги в масштабе экрана ---- */
.sb-ed .sb-ed-shell { margin: 0 0 var(--sb-gap); border: 1px solid var(--sb-line-2); border-radius: var(--sb-radius-lg); background: #fff; overflow: visible; }
.sb-ed .sb-ed-shell:focus-within { border-color: var(--sb-line-2); box-shadow: none; }
.sb-ed .sb-toolbar { top: calc(var(--sb-header-h) + env(safe-area-inset-top) + var(--ed-bar-h, 50px)); z-index: 6; border-radius: calc(var(--sb-radius-lg) - 1px) calc(var(--sb-radius-lg) - 1px) 0 0; }
.sb-ed .sb-editor {
  position: static; min-height: 24rem; padding: 2rem max(1.25rem, calc((100% - var(--sh-tw, 36rem)) / 2)) 2.5rem; border: 0; border-radius: 0 0 var(--sb-radius-lg) var(--sb-radius-lg);
  background: #fff; color: #000; font-family: var(--sh-font); font-size: var(--sh-fs); line-height: var(--sh-lh);
  text-align: var(--sh-align); hyphens: manual; -webkit-hyphens: manual; overflow-wrap: break-word;
}
.sb-ed .sb-editor:focus { box-shadow: none; }
.sb-ed .sb-editor:empty::before { font-size: .9375rem; color: var(--sb-muted); }
.sb-ed .sb-editor p { margin: 0 0 var(--sh-after); text-indent: var(--sh-ind); text-align: inherit; }
.sb-ed .sb-editor p[align=center], .sb-ed .sb-editor p[align=right] { text-indent: 0; }
.sb-ed .sb-editor h2 { margin: .5em 0; font-family: inherit; font-size: var(--sh-hfs); font-weight: 700; text-align: center; text-indent: 0; }
.sb-ed .sb-editor h3 { margin: .5em 0 .25em; font-family: inherit; font-size: inherit; font-weight: 700; font-style: italic; }
.sb-ed .sb-editor table { font-size: var(--sh-tfs); line-height: 1.15; }
.sb-ed .sb-editor td, .sb-ed .sb-editor th { border-color: #000; padding: .15em .4em; }
.sb-ed .sb-editor caption { font-size: var(--sh-fs); }
.sb-ed .sb-editor figcaption { font-size: inherit; }
.sb-ed .sb-editor li { text-align: inherit; margin-bottom: 0; }
/* разрыв листа «Страница N»: место там, где в сборнике начинается новый лист (app.js, по замеру просмотра);
   полоса во всю ширину листа – как промежуток между двумя листами */
.sb-editor sb-pg { display: block; height: 2.5rem; margin: 0; user-select: none; -webkit-user-select: none; pointer-events: none; }
.sb-editor sb-pg::before {
  content: attr(data-n); position: absolute; left: -1px; right: -1px; height: 2.5rem; box-sizing: border-box;
  display: flex; align-items: center; justify-content: flex-end; padding: 0 max(1.25rem, calc((100% - var(--sh-tw, 36rem)) / 2));
  background: var(--sb-page); border-top: 1px solid var(--sb-line-2); border-bottom: 1px solid var(--sb-line-2);
  font: 400 .8125rem/1 var(--bs-font-sans-serif); font-style: normal; color: var(--sb-muted); text-indent: 0; text-align: right; letter-spacing: 0;
}
@media (max-width: 767.98px) {
  .sb-ed .sb-ed-shell { margin: 0 calc(-1 * var(--sb-gutter)) var(--sb-gap); border-left: 0; border-right: 0; border-radius: 0; }
  .sb-ed .sb-toolbar { border-radius: 0; }
  .sb-ed .sb-editor { padding: 1.25rem 1rem 1.75rem; font-size: 1.0625rem; text-align: left; border-radius: 0; }
  .sb-ed .sb-editor p { text-indent: 1.5em; }
  .sb-editor sb-pg::before { left: 0; right: 0; padding: 0 1rem; }
}

/* ---- список литературы (п. 38): нумерованные строки в напечатанном виде (шрифт книги, одна строка с многоточием);
   нажатие – поле с исходным текстом; пометка – только у строки с проблемой; «⋮» и значок перетаскивания –
   при наведении, на сенсорном экране «⋮» виден всегда ---- */
.sb-ed-refs-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; margin-bottom: .5rem; border-radius: var(--sb-radius-lg); }
.sb-ed-h { margin: 0; font-size: .9375rem; }
.sb-ed-refs-head .sb-ed-cnt { margin: 0; }
.sb-rl { position: relative; list-style: none; margin: 0; padding: 0; }
.sb-rl-item {
  position: relative; display: grid; grid-template-columns: 2rem minmax(0, 1fr) auto 2.25rem;
  grid-template-areas: "num view mark meta"; column-gap: .375rem; align-items: center; min-height: 40px;
  background: #fff; border-radius: var(--sb-radius); cursor: text;
}
.sb-rl[data-num="[1]"] .sb-rl-item { grid-template-columns: 2.5rem minmax(0, 1fr) auto 2.25rem; }
.sb-rl-item:not(.is-edit):hover { background: var(--sb-surface-2); }
/* значок перетаскивания – в поле карточки слева от номера, только при наведении */
.sb-rl-item > .sb-drag {
  position: absolute; left: -1.25rem; top: 3px; display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 34px;
  padding: 0; border: 0; background: none; color: var(--sb-muted); cursor: grab; opacity: 0; transition: opacity .12s;
}
.sb-rl-item:hover > .sb-drag { opacity: .7; }
.sb-rl-item > .sb-drag .sb-ic { width: 1rem; height: 1rem; }
.sb-rl-n { grid-area: num; text-align: right; font-family: var(--sb-paper-font); font-size: .9375rem; line-height: 1.5; font-variant-numeric: tabular-nums; color: var(--sb-ink); white-space: nowrap; }
/* напечатанный вид: запись по стилю кафедры, одной строкой; целиком – во всплывающей подсказке и при правке */
.sb-rl-view {
  grid-area: view; min-width: 0; padding: .5rem 0; font-family: var(--sb-paper-font); font-size: .9375rem; line-height: 1.5; color: #000;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* поле правки: видно, пока в нём курсор; иначе – невидимое, но достижимое с клавиатуры (Tab открывает правку) */
.sb-rl-item:not(.is-edit) > .sb-rl-input {
  position: absolute; left: 0; top: 0; width: 1px !important; height: 1px !important; min-height: 0 !important;
  padding: 0; border: 0; opacity: 0; pointer-events: none; overflow: hidden; resize: none;
}
/* правка: поле на месте напечатанной строки, пометка остаётся справа, где была, – строки ниже не сдвигаются */
.sb-rl-item.is-edit {
  grid-template-areas: "num input mark meta"; align-items: start; padding: .1875rem 0; cursor: auto;
}
.sb-rl-item.is-edit > .sb-rl-view { display: none; }
.sb-rl-item.is-edit > .sb-rl-n { padding-top: .375rem; }
.sb-rl-item.is-edit > .sb-drag { visibility: hidden; }
.sb-rl .sb-rl-item.is-edit > .sb-rl-input.form-control { grid-area: input; min-height: 34px; }
/* пустая строка (новая внизу, опустевшая) не видна, пока в ней нет курсора – её открывает «Добавить источник» */
.sb-rl-item.is-empty:not(.is-edit) { display: block; height: 0; min-height: 0; overflow: hidden; }
.sb-rl-item.is-empty:not(.is-edit) > :not(.sb-rl-input) { display: none; }
/* пометка: «заполнить по полям», «повтор № 2 – удалить» – красным; «не проверено», «нет ссылки в тексте» – серым */
.sb-rl-mark { grid-area: mark; min-width: 0; font-size: .8125rem; line-height: 1.4; color: var(--sb-bad-ink); white-space: nowrap; }
.sb-rl-mark[hidden] { display: none; }
.sb-rl-mark.is-advice, .sb-rl-item[data-state=net] .sb-rl-mark { color: var(--sb-muted); }
.sb-rl-item.is-edit > .sb-rl-mark { padding-top: .5rem; }
.sb-rl-act {
  display: inline; min-height: 0; padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: inherit; cursor: pointer;
}
.sb-rl-act:hover { text-decoration: underline; text-underline-offset: .2em; }
.sb-rl-item.is-stale .sb-rl-mark { opacity: .55; }
.sb-rl-meta { grid-area: meta; }
.sb-rl-meta[hidden] { display: none; }
.sb-rl-more {
  display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 34px; padding: 0; border: 0; border-radius: var(--sb-radius);
  background: none; color: var(--sb-muted);
}
.sb-rl-more:hover, .sb-rl-more[aria-expanded=true] { background: var(--sb-page); color: var(--sb-ink); }
.sb-rl-more > .sb-ic { width: 1.125rem; height: 1.125rem; }
/* мышь: «⋮» только при наведении на строку (или с клавиатуры) */
@media (hover: hover) and (pointer: fine) {
  .sb-rl-more { opacity: 0; transition: opacity .12s; }
  .sb-rl-item:hover .sb-rl-more, .sb-rl-item:focus-within .sb-rl-more, .sb-rl-more[aria-expanded=true] { opacity: 1; }
}
/* сенсорный экран: наведения нет – значок перетаскивания не прячется под пальцем, переносят через «⋮» */
@media (hover: none) { .sb-rl-item > .sb-drag { visibility: hidden; } }
.sb-rl-menu .dropdown-menu { min-width: 16rem; }
.sb-rl-menu .dropdown-item { white-space: nowrap; font-size: .875rem; }
/* UI-KIT: пункты меню – 36 px (на сенсорном экране – 44 px, под палец) */
@media (hover: hover) and (pointer: fine) { .sb-rl-menu .dropdown-item { min-height: 36px; padding-top: .4375rem; padding-bottom: .4375rem; } }
.sb-rl-menu .dropdown-item:disabled { opacity: .45; }
.sb-rl-item.is-flash { animation: sb-ed-hl 1.6s ease-out; }
.sb-rl-item.is-ghost { opacity: .4; }
.sb-rl-item.is-dragging { box-shadow: var(--sb-shadow-pop); }
.sb-rl-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1.25rem; margin-top: .25rem; padding-left: 2.375rem; }
.sb-rl[data-num="[1]"] ~ .sb-rl-actions { padding-left: 2.875rem; }
.sb-rl-actions .sb-link-btn > .sb-ic { width: 1rem; height: 1rem; }
.sb-rl-clear { margin-left: auto; color: var(--sb-muted); }
.sb-rl-clear:hover { color: var(--sb-bad-ink); }
.sb-rl-notice { margin-top: 1rem; }
.sb-rl-alpha { margin: .75rem 0 0; }
/* [?] – ссылка на удалённый источник: подсвечена в тексте статьи (app.js, CSS Custom Highlight) */
::highlight(sb-cite-q) { background-color: var(--sb-bad-bg); color: var(--sb-bad-ink); }
@media (max-width: 991.98px) {
  .sb-rl-item { min-height: 44px; grid-template-columns: 2rem minmax(0, 1fr) auto 44px; }
  .sb-rl[data-num="[1]"] .sb-rl-item { grid-template-columns: 2.5rem minmax(0, 1fr) auto 44px; }
  .sb-rl-item > .sb-drag { top: 5px; }
  .sb-rl-view { padding: .625rem 0; }
  .sb-rl-item.is-edit > .sb-rl-n { padding-top: .625rem; }
  .sb-rl .sb-rl-item.is-edit > .sb-rl-input.form-control { min-height: 44px; }
  .sb-rl-item.is-edit > .sb-rl-mark { padding-top: .8125rem; }
  .sb-rl-more { width: 44px; height: 44px; }
  .sb-rl-act { display: inline-block; padding: .6875rem 0; margin: -.6875rem 0; }
}
@media (max-width: 767.98px) {
  .sb-rl-item, .sb-rl[data-num="[1]"] .sb-rl-item {
    grid-template-columns: 1.75rem minmax(0, 1fr) 44px; grid-template-areas: "num view meta" ". mark mark"; column-gap: .375rem;
  }
  .sb-rl[data-num="[1]"] .sb-rl-item { grid-template-columns: 2.25rem minmax(0, 1fr) 44px; }
  .sb-rl-item.is-edit, .sb-rl[data-num="[1]"] .sb-rl-item.is-edit { grid-template-areas: "num input meta" ". mark mark"; }
  .sb-rl-item.is-edit > .sb-rl-mark { padding-top: 0; margin: .25rem 0 .375rem; }
  .sb-rl-item > .sb-drag { display: none; }
  .sb-rl-mark { margin: -.375rem 0 .375rem; white-space: normal; }
  .sb-rl-actions, .sb-rl[data-num="[1]"] ~ .sb-rl-actions { padding-left: 0; gap: 0 1.25rem; }
  .sb-rl-clear { margin-left: 0; }
}

/* ---- окно «Заполнить по полям» ---- */
.sb-kinds { display: flex; flex-wrap: wrap; gap: .375rem; margin-bottom: 1rem; }
.sb-kinds button {
  min-height: 34px; padding: .3125rem .75rem; border: 1px solid var(--sb-line-2); border-radius: var(--sb-radius);
  background: #fff; color: var(--sb-ink); font: inherit; font-size: .875rem; font-weight: 500; cursor: pointer;
}
.sb-kinds button:hover { border-color: var(--sb-brand-600); }
.sb-kinds button.on { border-color: var(--sb-brand-600); background: var(--sb-brand-50); color: var(--sb-brand-800); box-shadow: inset 0 0 0 1px var(--sb-brand-600); }
.ref-fields { gap: .75rem 1rem; }
.ref-fields label { font-size: .875rem; font-weight: 500; color: var(--sb-ink); gap: .25rem; }
.ref-fields .ref-online { display: flex; align-items: center; gap: .75rem; min-height: 34px; margin: 0; grid-column: 1 / -1; }
.ref-fields .ref-online .form-check-label { font-weight: 500; cursor: pointer; }
.ref-fields .rf-label { display: block; }
.ref-fields .form-text { margin-top: 0; font-weight: 400; }
.ref-fields .is-invalid { border-color: var(--sb-bad-icon); }
@media (max-width: 767.98px) { .ref-fields { grid-template-columns: 1fr; } }
@media (max-width: 991.98px) { .sb-kinds button, .ref-fields .ref-online { min-height: 44px; } }
/* итог: в разметке стоит последним в подвале (после кнопок), на экране – первым */
.ref-foot { flex-wrap: wrap; }
.ref-result { margin: 0; padding: .75rem 1rem; border-radius: var(--sb-radius); background: var(--sb-surface-2); font-family: var(--sb-paper-font); font-size: .9375rem; line-height: 1.5; overflow-wrap: anywhere; }
.ref-result:empty { display: none; }
.ref-foot .ref-result { order: -1; flex: 1 0 100%; max-height: 7.5em; overflow: auto; }
.ref-result[data-tone=bad] { background: var(--sb-bad-bg); color: var(--sb-bad-ink); font-family: inherit; }
.ref-result .ref-result-label { font-family: var(--bs-font-sans-serif); color: var(--sb-ink-2); font-size: .875rem; }
.ref-now { margin-bottom: 1rem; padding: .75rem 1rem; border-radius: var(--sb-radius); background: var(--sb-surface-2); }
.ref-now-text { margin: .25rem 0 0; font-family: var(--sb-paper-font); font-size: .9375rem; overflow-wrap: anywhere; }
@media (max-width: 767.98px) {
  /* кнопки в один ряд (тема ставит их столбиком) – больше места полям */
  .modal-footer.ref-foot { flex-direction: row; align-items: center; }
  .modal-footer.ref-foot > .btn { flex: 1 1 auto; width: auto; }
}

/* панель инструментов: всё видно, на телефоне – максимум в две строки, без прокрутки вбок */
.sb-toolbar.editor-toolbar { flex-wrap: wrap; overflow: visible; }
@media (max-width: 767.98px) {
  .sb-toolbar.editor-toolbar { gap: .25rem .5rem; padding: .375rem; }
  .sb-toolbar .sb-tb-group { gap: 0; }
  .sb-toolbar .sb-tb-btn { min-width: 40px; height: 44px; padding: 0 .5rem; }
}

/* ---- «Просмотр» (п. 39): листы в натуральных пропорциях, масштаб «−», «+», «По ширине» в шапке окна ---- */
.sb-pv .modal-header { flex-wrap: wrap; gap: .5rem 1rem; }
.sb-pv .modal-title { flex: 1 1 auto; min-width: 0; }
.sb-pv-zoom { display: inline-flex; align-items: center; gap: .125rem; margin-left: auto; }
.sb-pv-btn {
  display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; padding: 0 .5rem;
  border: 1px solid var(--sb-line-2); border-radius: var(--sb-radius); background: #fff; color: var(--sb-ink); font-size: .875rem; font-weight: 500;
}
.sb-pv-btn:hover { border-color: var(--sb-brand-600); color: var(--sb-brand-800); }
.sb-pv-btn > .sb-ic { width: 1rem; height: 1rem; }
.sb-pv-fit { margin-left: .375rem; }
.sb-pv-fit[aria-pressed=true] { border-color: var(--sb-brand-600); background: var(--sb-brand-50); color: var(--sb-brand-800); }
.sb-pv-val { min-width: 3.5rem; text-align: center; font-size: .8125rem; color: var(--sb-muted); font-variant-numeric: tabular-nums; }
.sb-pv .sb-close { margin-left: .25rem; }
/* окно прокручивается по вертикали и, если лист крупнее окна, – по горизонтали */
#preview-body.doc-wrap { overflow: auto; }
#preview-body .doc-sheet { margin-left: auto; margin-right: auto; }
#preview-body.is-big .doc-sheet { margin-left: 0; }
@media (max-width: 991.98px) {
  .sb-pv-btn { min-width: 44px; height: 44px; }
}
@media (max-width: 767.98px) {
  .sb-pv .modal-title { flex-basis: calc(100% - 4rem); }
  .sb-pv-zoom { order: 3; flex: 1 0 100%; justify-content: center; margin-left: 0; }
  .sb-pv .sb-close { order: 2; }
}