/* Принудительно светлая тема */
:root {
    color-scheme: light;

}

html {
    font-family: "Noto Sans", sans-serif;
}


.dark-mode {
    filter: none !important;
}

.dark-mode * {

    color: #111 !important;
}

/* Тёмная тема гасилась только по ТЕКСТУ, а фон оставался тёмным от темы вики:
   единственная тёмная поверхность — сам body (остальные прозрачные, сайдбар
   бежевый, навбар синий). Получалось «текст #111 на rgb(37,40,44)» — читать
   нечего (замечено 29.08.2026 на «Сообществе», но так было на ВСЕХ страницах
   вики у любого, кто хоть раз нажал «Toggle dark mode» в меню «⋮»: выбор
   запоминается). Дожимаем светлую тему до конца — фон белый.
   Правило нужно ИМЕННО на body: `.dark-mode *` его не покрывает (сам body под
   `*` не попадает), а красить фон всем подряд нельзя — слетят навбар и крышка. */
body.dark-mode {
    background-color: #fff !important;
}

.dark-mode nav.navbar,
.dark-mode nav.navbar * {
    color: #fff !important;
}

/* Фон navbar как на главной странице */
.navbar {
    background-color: #42a5f5 !important;
}

.navbar * {
    background-color: transparent !important;

}


/* Контейнер навигации внутри navbar */
#cae-custom-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    min-width: 0;
}

.cae-logo-link {
    display: flex;
    align-items: center;
    margin-right: 15px;
    flex-shrink: 0;
}


.cae-nav-items {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
}

.cae-nav-item {
    color: white;
    text-decoration: none;
    font-weight: 700;
    font-size: 16px;
    display: flex;
    align-items: center;
    white-space: nowrap;
    transition: all 0.3s ease;

}

.cae-nav-item:hover {
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
    opacity: 1;
    text-decoration: none;
}

/* Активный пункт меню — подчёркивание как на главной */
.cae-nav-item.active span {
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 1px;
}

.cae-nav-item.active {
    color: #fff !important;
}

.cae-nav-item i {
    font-size: 1.1em;
}

/* Адаптивность: мобильный хэдер — три строки */
@media (max-width: 917px) {

    .navbar.navbar {
        height: 72px !important;
        min-height: 30px;
        padding-top: 3px;
        padding-bottom: 3px;
    }

    .cae-nav-items {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1px;
        margin-left: 20px;
        margin-top: 4px;
        margin-bottom: 4px;
        margin-right: -8px;
    }

    .cae-nav-row {
        display: flex;
        justify-content: center;
        gap: 0;
        flex-wrap: nowrap;
    }

    .cae-nav-item {
        padding: 4px 6px;
        white-space: nowrap;
    }

    .cae-nav-item span {
        font-size: 12px;
    }

    .cae-nav-item:not(:last-child)::after {
        content: "•";
        position: absolute;
        right: -16px;
        color: rgba(255, 255, 255, 1);
        font-weight: normal;
        transform: scale(1.5);
    }

    .cae-nav-item i {
        margin-right: 8px;
        font-size: 12px !important;
    }

    .cae-logo-link {
        position: fixed;
        width: 64px;
        height: 64px;
        top: 1px;
        left: 2px;
        z-index: 9999;
        transition: transform 0.3s ease;
        isolation: isolate;
    }

    .cae-logo-link::before {
        content: "";
    position: absolute;
    inset: -24%;
    border-radius: 20%;
    background: radial-gradient(circle closest-side,
        rgba(255, 255, 255, 1) 28%,
        rgba(255, 255, 255, 1) 40%,
        rgba(255, 255, 255, 0.92) 50%,
        rgba(255, 255, 255, 0.78) 58%,
        rgba(255, 255, 255, 0.6) 66%,
        rgba(255, 255, 255, 0.42) 73%,
        rgba(255, 255, 255, 0.27) 80%,
        rgba(255, 255, 255, 0.16) 86%,
        rgba(255, 255, 255, 0.08) 91%,
        rgba(255, 255, 255, 0.035) 95%,
        rgba(255, 255, 255, 0.012) 98%,
        rgba(255, 255, 255, 0) 100%);
    z-index: -1;
    pointer-events: none;
    }

    .cae-nav-logo {
        width: 100%;
        height: auto;
        display: block;
        opacity: 0.95;
        position: relative;
    }
}

/* Десктоп: навигация в одну строку */
@media (min-width: 917px) {
    .cae-nav-item:hover {
        text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) !important;
        opacity: 1 !important; /* На всякий случай */
    }

    .cae-logo-link {
        position: fixed;
        width: 70px;
        height: auto;
        top: -3px;
        left: 0;
        z-index: 9999;
        transition: transform 0.3s ease;
        isolation: isolate;
    }

    .cae-logo-link::before {
        content: "";
        position: absolute;
        top: -16.8px;
        left: -16.8px;
        width: 103.6px;
        height: 103.6px;
        border-radius: 20%;
        background: radial-gradient(circle closest-side,
            rgba(255, 255, 255, 1) 28%,
            rgba(255, 255, 255, 1) 40%,
            rgba(255, 255, 255, 0.92) 50%,
            rgba(255, 255, 255, 0.78) 58%,
            rgba(255, 255, 255, 0.6) 66%,
            rgba(255, 255, 255, 0.42) 73%,
            rgba(255, 255, 255, 0.27) 80%,
            rgba(255, 255, 255, 0.16) 86%,
            rgba(255, 255, 255, 0.08) 91%,
            rgba(255, 255, 255, 0.035) 95%,
            rgba(255, 255, 255, 0.012) 98%,
            rgba(255, 255, 255, 0) 100%);
        z-index: -1;
        pointer-events: none;
    }

    .cae-nav-logo {
        width: 100%;
        height: auto;
        display: block;
        opacity: 0.95;
        position: relative;
    }

    .cae-logo-link:hover {
        transform: scale(1.15); /* Немного увеличивается при наведении */
    }

    .cae-logo-link:hover .cae-nav-logo {
        opacity: 1;
    }

    .cae-nav-items {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 0;
    }

    .cae-nav-row {
        display: contents;
    }

    /* Точки после всех пунктов на десктопе */
    .cae-nav-item::after {
        content: "•";
        position: absolute;
        right: -16px;
        color: rgba(255, 255, 255, 1);
        font-weight: normal;
        transform: scale(1.5);
        pointer-events: none;
    }

    /* Убрать точку только у последнего пункта (Инструкция) */
    .cae-nav-row:last-child .cae-nav-item:last-child::after {
        display: none;
    }
}

/* --- Скрываем стандартные элементы Otter Wiki --- */

/* Скрыть кнопку бокового меню (гамбургер) слева */
button[onclick*="toggleSidebar"],
.navbar-content button .fa-bars {
    display: none !important;
}

/* Скрыть форму поиска и иконку поиска справа */
.navbar form[action*="search"],
.navbar .fa-search,
.navbar-content input[name="q"] {
    display: none !important;
}

/* Скрыть хлебные крошки (строку с иконкой домика под меню) */
.breadcrumb,
nav[aria-label="breadcrumb"] {
    display: none !important;
}

div#extra-nav.extra-nav {
    display: none !important;
}


/* Скрываем боковую панель */
#column-extra, .extra-nav-container, .col-xl-3.d-none.d-xl-block {
    display: none !important;
}


/*-----------------------------------------------------------------------------------------------*/

/* Мягче: не трогаем фон у всех подряд */
.navbar a,
.navbar button,
.navbar .nav-link,
.navbar .dropdown-menu,
.navbar .dropdown-item-with-icon,
.dropdown-menu.dropdown-menu-right.w-200 .dropdown-icon,
.navbar .dropdown-icon {
    color: white !important;

}

.dropdown-menu.dropdown-menu-right.w-200 {
    background-color: #42a5f5 !important; /* твой голубой */

}

/* background: #1e5a8e;*/


.navbar {
    /* Фиксируем высоту и цвет как в образце */
    height: 30px !important;
    min-height: 30px !important;

    /* Центрирование и flex-настройки */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 0 20px !important;

    /* Тени и наложение */
    z-index: 2100 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;

    /* Сбрасываем лишние отступы Otter Wiki */
    margin-bottom: 0 !important;
}

@media (max-width: 871px) {
    .cae-nav-item {
        /* Текст и цвет */
        font-family: "Noto Sans", sans-serif !important;
        color: white !important;
        text-decoration: none !important;
        font-weight: 700 !important; /* Жирный шрифт */
        font-size: 12px !important;

        /* Расположение */
        display: flex !important;
        align-items: center !important;
        position: relative !important;
        margin: 0 12px !important; /* Отступы между пунктами */
        margin-right: 15px !important; /* Доп. отступ для точки */

        /* Эффекты текста */

        letter-spacing: 0.3px !important;


        /* Сброс стандартных стилей кнопок/ссылок */
        background: transparent !important;
        border: none !important;
        padding: 0 !important;

        text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
        transition: all 0.3s ease;
    }

    .cae-nav-item i {
        margin-right: 8px !important;
        font-size: 12px !important;
    }
}

.cae-nav-item {
    /* Текст и цвет */
    font-family: "Noto Sans", sans-serif !important;
    color: white !important;
    text-decoration: none !important;
    font-weight: 700 !important; /* Жирный шрифт */
    font-size: 16px !important;

    /* Расположение */
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    margin: 0 12px !important; /* Отступы между пунктами */
    margin-right: 15px !important; /* Доп. отступ для точки */

    /* Эффекты текста */

    letter-spacing: 0.3px !important;


    /* Сброс стандартных стилей кнопок/ссылок */
    background: transparent !important;
    border: none !important;
    padding: 0 !important;

    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
    transition: all 0.3s ease;
}

/* Иконки внутри пунктов */
.cae-nav-item i {
    margin-right: 8px !important;

}


.cae-nav-item.active {
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6) !important;
}

.cae-nav-item.active span {
    text-decoration: underline !important;
    text-decoration-thickness: 1.5px !important;
    text-underline-offset: 1px !important;
}


.cae-nav-item:not(:last-child)::after {
    content: "•";
    position: absolute;
    right: -16px; /* Позиция точки ровно посередине отступа */
    color: rgba(255, 255, 255, 1);
    font-weight: normal;
    transform: scale(1.5);
    pointer-events: none; /* Чтобы точка не была кликабельной */
}

.navbar button#navbar-dropdown-toggle-btn-1.btn.btn-action,
.navbar a.btn {
    transform: scale(0.8);

}


@media (max-width: 917px) {
    .navbar button#navbar-dropdown-toggle-btn-1.btn.btn-action,
    .navbar a.btn {
        display: none !important;

    }
}


/* Скроллбары в .content-wrapper в тёмной теме — белые/светлые */
.dark-mode .content-wrapper, .dark-mode .sidebar-scroll-inner {
    /* Firefox */
    scrollbar-color: #666 #f1e9d8;
}

/* Chrome, Edge, Safari */
.dark-mode .content-wrapper::-webkit-scrollbar, .dark-mode .sidebar-scroll-inner::-webkit-scrollbar {
    width: 8px;
}

.dark-mode .content-wrapper::-webkit-scrollbar-track, .dark-mode .sidebar-scroll-inner::-webkit-scrollbar-track {
    background: #f1e9d8;
}

.dark-mode .content-wrapper::-webkit-scrollbar-thumb, .dark-mode .sidebar-scroll-inner::-webkit-scrollbar-thumb {
    background-color: #ffffff; /* сам ползунок белый */
    border-radius: 4px;
    border: 2px solid #f1e9d8; /* белый фон вокруг ползунка */
}

.sidebar {
    background-color: rgb(241, 233, 216) !important;
    border: 2px solid rgba(0, 0, 0, .2);
}

/* === Рамка оглавления: зазор под навбаром (ТЗ 19.08.2026, п.1) ===
   Бордер у .sidebar был со всех четырёх сторон и раньше, но сверху его не
   было видно по двум причинам:
     1) сайдбар начинался на зашитых 30px (десктоп) / 33px (мобильный режим
        книги), а навбар при узком окне переносится в три строки и вырастает
        до 72px — верх сайдбара вместе с бордером уходил ПОД шапку. Особенно
        коварна полоса 872–917px: layout уже десктопный, а навбар ещё
        мобильный. Лечится тем, что top/height считаются от --navbar-height
        (её ведёт custom.js по реальному замеру навбара).
     2) даже когда бордер попадает в видимую зону, его затирает тень навбара
        (.navbar { box-shadow: 0 2px 4px }, z-index 2100 > 2000 у сайдбара —
        поднять сайдбар выше нельзя, он закроет свисающий из шапки логотип).
        Тень бьёт примерно на 4px вниз и сливается с 2px-линией в мутную полосу.

   19.08.2026 это лечилось зазором --toc-top-gap: 4px — панель опускалась ниже
   шапки, и линия выходила из-под тени. 21.08.2026 заказчик забраковал зазор
   («панель сдвинута вниз»), поэтому зазор = 0: панель снова вплотную к шапке.
   ⚠️ Следствие: сверху линия читается слабее правой — она под тенью. Чтобы
   вернуть ей чёткость, есть ровно два пути, оба вне оглавления: убрать/ужать
   тень навбара, либо рисовать линию псевдоэлементом САМОГО навбара (дети
   элемента рисуются поверх его же box-shadow). Ни то ни другое без решения
   заказчика не делаем.
   Переменную оставляем: от неё считается компенсация отступа дерева ниже, и
   при 0 она даёт ровно прежний margin в 25px. */
:root {
    --toc-top-gap: 0px;
}

/* === Буферные полоски оглавления (п.2 ТЗ 19.08.2026) ===
   Такие же, как в статьях «О ЦАЭ»/«О проекте» (.page::before/::after, 16px):
   непрозрачные поля у верхнего и нижнего края, за которые уходит текст при
   прокрутке. Абсолютное позиционирование считается от padding-box сайдбара,
   поэтому полоски не залезают на сам бордер.
   ⚠️ БЕЗ парного padding у .sidebar-scroll-inner — на этом обожглись
   19.08.2026. Над деревом книг уже есть ~52px собственного просвета
   (margin-top у .sidebar-menu + <br> от скрытых Home/A-Z), и добавленные
   сверху 16px просто оттолкнули оглавление вниз. Полоска ложится ПОВЕРХ
   этого просвета: в покое ничего не скрыто, при прокрутке текст тает под
   ней. Снизу так же — там 25px margin-bottom у .sidebar-menu. */
.sidebar::before,
.sidebar::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 16px;
    /* В цвет фона сайдбара — полоска не должна читаться как элемент, её работа
       в том, что текст под ней тает. На приёмке 21.08.2026 временно красили
       в red, чтобы заказчик увидел границы. */
    background-color: rgb(241, 233, 216);
    z-index: 1;
    pointer-events: none;
}

.sidebar::before {
    top: 0;
}

.sidebar::after {
    bottom: 0;
}

@media (min-width: 360px) and (max-width: 917px) {
    .sidebar.d-flex.flex-column.relative {
        width: 83vw;
        max-width: 83vw;
        height: 100vh; /* ключевое */
    }
}


.content-wrapper, .sidebar-scroll-inner {
    /* Firefox */
    scrollbar-color: #666 #f1e9d8;
}

.content-wrapper::-webkit-scrollbar, .sidebar-scroll-inner::-webkit-scrollbar {
    width: 8px;
}

.content-wrapper::-webkit-scrollbar-track, .sidebar-scroll-inner::-webkit-scrollbar-track {
    background: #f1e9d8;
}

.content-wrapper::-webkit-scrollbar-thumb, .sidebar-scroll-inner::-webkit-scrollbar-thumb {
    background-color: #ffffff; /* сам ползунок белый */
    border-radius: 4px;
    border: 2px solid #f1e9d8; /* белый фон вокруг ползунка */
}

/* Убрать стрелочки нативного скроллбара. */
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:horizontal,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:start,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:end,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:single-button,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:double-button,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical:start:increment,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical:start:decrement,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical:end:increment,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical:end:decrement,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical:double-button:start:decrement,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical:double-button:start:increment,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical:double-button:end:decrement,
.page-wrapper.with-navbar > .content-wrapper::-webkit-scrollbar-button:vertical:double-button:end:increment,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:start,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:end,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:single-button,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:double-button,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical:start:increment,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical:start:decrement,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical:end:increment,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical:end:decrement,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical:double-button:start:decrement,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical:double-button:start:increment,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical:double-button:end:decrement,
.page-wrapper.with-navbar > .sidebar::-webkit-scrollbar-button:vertical:double-button:end:increment,
.sidebar-scroll-inner::-webkit-scrollbar-button,
.book-scroll-content::-webkit-scrollbar-button,
.page::-webkit-scrollbar-button {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

div#column-main.col-xl-9 {
    font-family: Literata, serif !important;
    text-align: justify;
}
.book-scroll-content {
    text-indent: 20px;
}

.sidebar.d-flex.flex-column.relative {
    font-family: Literata, serif !important;
}

@media (min-width: 360px) and (max-width: 917px) {
    .sidebar.d-flex.flex-column.relative {
        width: 83vw;
        max-width: 83vw;
        height: 100vh; /* ключевое */
    }
}

/* overflow:visible на .sidebar, чтобы кнопка-язычок (right:-32px) выступала.
   Вертикальный скролл перенесён на .sidebar-scroll-inner (создаётся в JS). */
.sidebar {
    overflow: visible !important;
}

.sidebar-scroll-inner {
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Нативный скроллбар оглавления скрыт ВЕЗДЕ (не только в режиме книги):
   вместо него JS вешает #cae-sidebar-scrollthumb — тонкий, угасающий и
   не наезжающий на бордер (см. custom.js → installCustomScrollbar,
   sidebarTrackGeometry). Раньше это делалось только под .is-fixed-header,
   и на странице-обложке «Книги» оставался толстый нативный ползунок. */
.sidebar-scroll-inner {
    scrollbar-width: none !important;
}

.sidebar-scroll-inner::-webkit-scrollbar {
    width: 0 !important;
    display: none !important;
}

div#column-main h1 {
    font-family: Literata, serif !important;
}

.page blockquote {
    padding-left: 2rem;
    padding-right: 2rem;
}

.page blockquote p {
    text-indent: 0 !important;
}

blockquote p {
    font-family: Literata, serif;
    text-indent: 0;
    font-style: italic;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

blockquote {
    border-left: none !important; /* Убирает синюю полоску */


    margin-top: 0 !important;
    margin-bottom: 0 !important;
    background-color: #d0eeff;

}

a {
    color: #02f;
    text-decoration: underline;
}

/* 1. Убираем нижний отступ у изображений, чтобы подпись могла быть ближе */
img.img-fluid {
    margin-bottom: 0 !important; /* Убираем стандартный отступ снизу */
    padding-bottom: 0 !important;
}

/* 2. Стилизуем и подтягиваем подпись */
center strong {
    display: block; /* Занимает всю ширину, ведет себя предсказуемо */
    font-size: 16px !important;
    transform: translateY(-10px); /* Поднимаем текст вверх на 10px НАД его нормальной позицией */
    margin-top: 5px; /* Небольшой коррекционный отступ, если нужно */
    color: #333; /* Цвет текста (опционально) */
}


.page h1 {
    font-size: 21px;
    font-weight: 700;
    text-align: center;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
}

.page h2 {
    font-size: 19px;
    font-weight: 700;
    text-align: center;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
}

.page h3 {
    font-size: 19px;
    text-align: center !important;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
}

/* В книгах (но не в Руководстве) H2/H3 лежат внутри .book-scroll-content,
   у которого text-indent: 20px для «красной строки» абзацев. На центрируемых
   заголовках этот indent сдвигает текст вправо примерно на indent/2.
   H1 живёт в .sticky-book-header (без indent) и центрируется честно —
   обнуляем indent у H2/H3, чтобы они стояли так же, как H1. Римские
   цифры (.cae-roman-num) тегируются из custom.js и страхуются !important
   на случай более специфичных правил сверху по каскаду. */
body:not(.guide-page) .book-scroll-content h2,
body:not(.guide-page) .book-scroll-content h3 {
    text-indent: 0;
    font-weight: 700;
}
.page h3.cae-roman-num {
    text-indent: 0 !important;
}

/* Заголовок-ссылка «ТАБЛИЦА» в книгах ЖЭ — ведёт на PDF соответствия дат
   параграфам (/otterwiki/tables/*.pdf). По ТЗ 11.08.2026: синий + подчёркивание,
   чтобы читателю было видно, что заголовок кликабелен. Заголовки в теме
   наследуют цвет текста, поэтому цвет задаём явно — тот же #1890ff, что у ссылок
   в статьях «О ЦАЭ» / «О проекте». Открытие соседней вкладкой — в custom.js
   (same-origin ссылкам '_blank' по умолчанию не ставится). */
.page h1 a[href$=".pdf"],
.page h2 a[href$=".pdf"],
.page h3 a[href$=".pdf"] {
    color: #1890ff !important;
    text-decoration: underline !important;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 2px;
}

/* ИЗОБРАЖЕНИЯ НА ВСЮ ШИРИНУ */
.content img:not(table img), .markdown-body img:not(table img), p img {
    max-width: 100% !important; /* Не дает выйти за пределы блока */
    /*height: auto !important;    !* Сохраняет пропорции *!*/
    display: block !important; /* Делает картинку блочным элементом */
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
}

#column-main, .col-xl-9 {
    /* 4. Внутренние отступы (padding) из вашего прошлого требования */
    padding: 17px 30px 20px 30px !important;
}

/* Растягиваем основной контент на 100% */
@media (min-width: 360px) and (max-width: 917px) {
    #column-main, .col-xl-9 {
        /* 1. Сначала растягиваем контейнер, чтобы он мог занимать все место */
        flex: 0 0 100% !important;
        width: 100% !important;

        /* 2. Ограничиваем максимальную ширину контента, как в оригинале */
        max-width: 1000px !important;

        /* 3. Центрируем этот блок по горизонтали */
        /* margin: 0 auto автоматически создаст равные отступы слева и справа,
           если экран шире 1000px. Это правильный способ имитации "margin" на больших экранах. */
        margin: 0 auto !important;

        line-height: 1.5;
    }

}


#column-main, .col-xl-9 {
    flex: 0 0 100%;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    line-height: 1.5;
}

/*Отступ убрал этот блядский*/
.page-wrapper.with-navbar {
    padding-top: 0px !important; /* Высота вашего navbar (30px), чтобы контент начинался ровно под ним */
}

/* Если зазор все еще есть, пробуем обнулить margin у самого верхнего контейнера */
.content-wrapper {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* На всякий случай проверяем первый заголовок */
#column-main > h1:first-child,
#column-main > div:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/*Убрал отступ бляяядддскиииййй*/

.quote-signature {
    text-align: right; /* Прижать вправо */
    margin: 0; /* Сбросить стандартные отступы */
    margin-right: 20px; /* Отступ справа */
    /*margin-top: 10px;       !* Отступ сверху *!*/
    margin-bottom: 25px; /* Отступ снизу */

    /* Дополнительно можно добавить шрифт или курсив, если нужно: */
    /* font-style: italic; */
}

.sidebarmenu li,
.sidebarmenu li > div.summary-details > a {
    word-break: break-word;
}

/* Прячем вики-обвязку сайдбара (Home, A-Z, in-page TOC, «Page Index», «toc»)
   на страницах книг/руководства ДО первой отрисовки — класс cae-book-like
   ставит инлайн-скрипт в customHead.html (до парса сайдбара). Раньше это делал
   только JS на DOMContentLoaded → на тяжёлых (~875КБ) страницах обвязка успевала
   мелькнуть при загрузке. Дерево книг — .sidebarmenu, его НЕ трогаем. */
html.cae-book-like .sidebar-link,
html.cae-book-like .collapse-header {
    display: none !important;
}

/* === Компенсация сдвига содержимого оглавления (20.08.2026, уточнено 21.08) ===
   Ради верхнего контура (п.1) панель опустилась из-под шапки ПОД неё. Раньше
   её верхние пиксели были спрятаны за навбаром, а вместе с ними — мёртвое
   место над деревом книг: разделитель <br> от скрытых Home/A-Z (≈21px) и
   штатный margin-top: 25px у .sidebar-menu, итого ~46px. Теперь панель видна
   целиком, и эти 46px вытолкнули бы дерево вниз. Вычитаем ровно столько,
   на сколько уехала панель.

   ⚠️ Величина сдвига РАЗНАЯ в трёх диапазонах, и в одном из них его нет вовсе —
   21.08.2026 на этом сгорел «пропадает пункт en»: компенсация висела на всех
   страницах книг при ≤917px, а панель там двигается не везде.
     • ≥918px — навбар 30px, панель 30 → 34, сдвиг = --toc-top-gap (4px).
       Правило .sidebar{position:fixed} из блока min-width:872px НЕ заскоуплено
       на режим книги, поэтому касается всех страниц с оглавлением.
     • 872–917px — layout уже десктопный, а навбар уже мобильный (72px):
       панель 30 → 76, сдвиг 46px. Тоже на всех страницах.
     • ≤871px — панель перепозиционируется ТОЛЬКО на книгах и в руководстве
       (body.is-fixed-header; guide-page его тоже получает, см. custom.js):
       33 → 76, сдвиг 43px. На остальных страницах (индекс книг, Home)
       сайдбар остаётся в потоке, position:relative, top 0 — двигать его
       содержимое НЕЛЬЗЯ, иначе первые пункты уезжают под шапку.

   ⚠️ На десктопе (≥918px) полные 25px убирать нельзя — это клиренс под круглый
   логотип ЦАЭ, свисающий из навбара на 46px (замер: низ логотипа 76.4px, верх
   дерева 76.6px). Там снимаем только --toc-top-gap.
   ⚠️ Скоуп cae-book-like: на обычных вики-страницах обвязка видна и <br>
   там работает разделителем. */
@media (min-width: 918px) {
    html.cae-book-like .sidebar-menu {
        margin-top: calc(25px - var(--toc-top-gap)) !important;
    }
}

@media (min-width: 872px) and (max-width: 917px) {
    html.cae-book-like .sidebar-menu {
        margin-top: 0 !important;
    }

    html.cae-book-like .sidebar-menu > br {
        display: none !important;
    }
}

@media (max-width: 871px) {
    html.cae-book-like body.is-fixed-header .sidebar-menu {
        margin-top: 0 !important;
    }

    html.cae-book-like body.is-fixed-header .sidebar-menu > br {
        display: none !important;
    }
}

/* Освобождаем 12px справа под кастомный ползунок оглавления
   (#cae-sidebar-scrollthumb, ширина 8px), чтобы он не наезжал на текст. */
.sidebarmenu ul {
    padding-right: 12px;
}

/* Активный (текущий) пункт оглавления в боковом меню */
.sidebarmenu li > div.summary-details > a.sidebar-current,
.sidebarmenu li > details > summary > a.sidebar-current {
    font-weight: 700 !important;
    color: #555 !important;
    opacity: 1.6;
}

/* Date-place rows: date left, place name right */
p.date-place-row {

    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* Пустая строка в конце каждой датированной записи (ТЗ 09.08.2026).
   Зазор вешаем СВЕРХУ на строку даты следующей записи — это и есть «конец»
   предыдущей. padding, а не margin: соседние margin'ы схлопываются с
   `margin-block-end: 1em` предыдущего абзаца и дали бы не +строку, а max(),
   то есть почти незаметный прирост. 1.5em = высота строки (line-height 1.5)
   и на десктопе (16px), и на мобилке (13px).
   ⚠️ Скоуп — только две книги, названные заказчиком (класс `dated-entry-gap`
   вешает custom.js по пути): «По тропам Срединной Азии» и «Развенчанный Тибет».
   «Алтай – Гималаи» и Фосдик остаются как были. */
body.dated-entry-gap .book-scroll-content > p.date-place-row:not(:first-child) {
    padding-block-start: 1.5em;
}

/* «Через: …» — своей строкой под датой, прижат вправо */
p.date-place-row > .place-via-right {
    flex: 0 0 100%;
    text-align: right;
}


:root {
    --css-scrollbar-width: auto;
}

/* === Кнопка-язычок: теперь дочерний элемент .sidebar === */
/* Кнопка позиционирована абсолютно внутри sidebar — при translateX()
   сайдбара она двигается ВМЕСТЕ с ним как единый компонент.
   Никакой отдельной анимации left не нужно. */
.sidebar.d-flex.flex-column.relative {
    will-change: transform;
}

.sidebar-toc-toggle {
    position: absolute;
    right: -32px; /* выступает за правый край сайдбара */
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 48px;

    background: rgb(241, 233, 216);
    border: 2px solid rgba(0, 0, 0, .2);
    border-left: none;
    border-radius: 0 4px 4px 0;

    cursor: pointer;
    z-index: 2001;

    display: flex;
    align-items: center;
    justify-content: center;
    color: #555 !important;
    padding: 0;
    margin: 0;
    font-size: 16px;
}

/* Иконка-шеврон плавно поворачивается вместе с открытием/закрытием */
.sidebar-toc-toggle i {
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.sidebar-toc-toggle:hover {
    background: #e6dcc5;
    color: #000;
}

/* prefers-reduced-motion: мгновенный показ/скрытие без анимации */
@media (prefers-reduced-motion: reduce) {
    .sidebar.d-flex.flex-column.relative {
        transition: none !important;
    }

    .sidebar-toc-toggle i {
        transition: none !important;
    }
}


/* Руководство: на мобилке (<872px) сайдбар фиксирован, чтобы кнопка-язычок была видна */
@media (max-width: 871px) {
    body.guide-page .sidebar.d-flex.flex-column.relative {
        position: fixed !important;
        top: calc(var(--navbar-height, 72px) + var(--toc-top-gap)) !important;
        left: 0 !important;
        width: 83vw;
        max-width: 83vw;
        /* Низ пришпилен к вьюпорту, а НЕ посчитан от 100vh (21.08.2026):
           Chrome на Android считает 100vh по «большому» вьюпорту — тому,
           что остаётся при УБРАННОЙ адресной строке. Пока строка видна,
           панель оказывалась выше экрана на её высоту, и нижний бордер
           вместе с буферной полоской уезжали за нижнюю кромку: текст
           оглавления просто обрывался краем экрана. `bottom: 0` у
           fixed-элемента считается от layout viewport, который меняется
           вместе с адресной строкой, поэтому низ всегда на месте.
           ⚠️ С 28.09.2026 отсчёт не от нуля, а от высоты прибитого футера:
           иначе полоса футера закрывает нижнюю буферную полоску
           (.sidebar::after) и нижний бордер оглавления. */
        bottom: var(--narrow-footer-h, 30px) !important;
        height: auto !important;
        z-index: 2000 !important;
    }

    body.guide-page #page-wrapper:not([data-sidebar-hidden="hidden"]) .sidebar.d-flex.flex-column.relative {
        transform: translateX(0) !important;
        transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }

    body.guide-page #page-wrapper[data-sidebar-hidden="hidden"] .sidebar.d-flex.flex-column.relative {
        transform: translateX(-100%) !important;
        transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }
}

/* DESKTOP: сайдбар фиксирован, как на мобилке — чтобы кнопка-язычок
   не обрезалась overflow:hidden у #page-wrapper при закрытии */
@media (min-width: 872px) {
    /* 19.08.2026: верх — РЕАЛЬНАЯ высота навбара (--navbar-height, её ведёт
       custom.js) плюс --toc-top-gap, а не зашитые 30px. См. подробности в
       блоке «Рамка оглавления» выше. height укорочен на тот же зазор — низ
       панели остаётся на прежнем месте. */
    .sidebar.d-flex.flex-column.relative {
        position: fixed !important;
        top: calc(var(--navbar-height, 30px) + var(--toc-top-gap)) !important;
        left: 0 !important;
        width: 275px;
        min-width: 275px;
        /* Низ пришпилен к вьюпорту, а НЕ посчитан от 100vh (21.08.2026):
           Chrome на Android считает 100vh по «большому» вьюпорту — тому,
           что остаётся при УБРАННОЙ адресной строке. Пока строка видна,
           панель оказывалась выше экрана на её высоту, и нижний бордер
           вместе с буферной полоской уезжали за нижнюю кромку: текст
           оглавления просто обрывался краем экрана. `bottom: 0` у
           fixed-элемента считается от layout viewport, который меняется
           вместе с адресной строкой, поэтому низ всегда на месте.
           ⚠️ С 28.09.2026 отсчёт не от нуля, а от высоты прибитого футера:
           иначе полоса футера закрывает нижнюю буферную полоску
           (.sidebar::after) и нижний бордер оглавления. */
        bottom: var(--narrow-footer-h, 30px) !important;
        height: auto !important;
        z-index: 2000 !important;
    }

    /* Въезд (открывается) — 0.8s */
    #page-wrapper:not([data-sidebar-hidden="hidden"]) .sidebar.d-flex.flex-column.relative {
        transform: translateX(0) !important;
        transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }

    /* Выезд (закрывается) — кнопка остаётся видимой (right:-32px выступает за край) */
    #page-wrapper[data-sidebar-hidden="hidden"] .sidebar.d-flex.flex-column.relative {
        transform: translateX(-100%) !important;
        transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }
}

/* DESKTOP: убрать кнопку управления вики с тремя точками для гостей */
@media (min-width: 917px) {
    body.user-guest .navbar button#navbar-dropdown-toggle-btn-1.btn.btn-action {
        display: none !important;
    }
}

/* MOBILE: убрать кнопки управления вики справа в хэдере */
@media (max-width: 917px) {
    .navbar a.btn,
    .navbar .dropdown-toggle.btn {
        display: none !important;
    }

    /* Кнопка с тремя точками — скрыть только для гостей */
    body.user-guest .navbar button#navbar-dropdown-toggle-btn-1.btn.btn-action,
    body.user-guest .navbar .btn-action {
        display: none !important;
    }
}

/* ========================================================= */
/* СКРЫТИЕ КНОПОК УПРАВЛЕНИЯ ДЛЯ ОБЫЧНЫХ ПОЛЬЗОВАТЕЛЕЙ (ГОСТЕЙ)*/
/* ========================================================= */

/* 1. Скрываем кнопку выпадающего меню (управление/настройки) в навбаре */
body.user-guest .navbar button#navbar-dropdown-toggle-btn-1,
body.user-guest .navbar .dropdown-menu {
    display: none !important;
}

/* 2. Скрываем любые прямые ссылки на логин, если они есть на странице */
body.user-guest a[href*="login"] {
    display: none !important;
}

/* 3. Скрываем кнопку "карандашика" (редактирования).
   Селектор a[href*="edit"] ищет любую ссылку, ведущую на страницу редактирования. */
body.user-guest a[href*="edit"],
body.user-guest button[aria-label*="Edit"],
body.user-guest button[title*="Edit"],
body.user-guest button[title*="Редактировать"],
body.user-guest .btn-edit {
    display: none !important;
}

/* 4. Опционально: если у вас есть блок с действиями страницы (история, экспорт и т.д.) */
body.user-guest .page-actions,
body.user-guest .header-actions {
    display: none !important;
}

/* === Layout для книг /books/ru/ (is-fixed-header) === */
body.is-fixed-header .content-wrapper {
    overflow: hidden !important;
}

/* Шапка книги — всегда сверху, не скроллится */
.sticky-book-header {
    flex-shrink: 0;
    background-color: #f1e9d8;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    position: relative;
    z-index: 2;
}

.dark-mode .sidebar-toc-toggle {
    color: #555 !important;
}
.dark-mode .sidebar-toc-toggle {
    color: #555 !important;
}
.fa-chevron-left:before {
    color: #555 !important;
}

.dark-mode .sticky-book-header {
    background-color: #f1e9d8;

}

/* Скроллящийся контент: fixed-контейнер от навбара до низа окна,
   скроллбар у правого края viewport. Видим всегда, независимо от
   состояния оглавления. Левый край и паддинги синхронизируются из JS
   под плавный переход .content-wrapper и #column-main. */
body.is-fixed-header .book-scroll-content {
    position: fixed;
    top: calc(var(--navbar-height) - 4px);
    right: 0;
    bottom: 0;
    left: var(--book-scroll-left, 0px);
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 0;
    padding-top: var(--book-header-height, 0px);
    padding-left: var(--book-content-pad-left, 0px);
    padding-right: var(--book-content-pad-right, 0px);
    box-sizing: border-box;
    scroll-padding-top: var(--book-header-height, 0px);
}

/* Непрозрачная «крышка» над шапкой — закрывает зазор между навбаром и
   заголовком, чтобы скроллящийся текст не просвечивал. Живёт внутри
   стаконтекста .sticky-book-header (z:2), поэтому гарантированно над
   .book-scroll-content (z:0). Ширина = ширина колонки заголовка, что
   совпадает по X с колонкой текста — зона справа остаётся под трек
   скроллбара. */
body.is-fixed-header .sticky-book-header::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    height: var(--book-header-gap, 0px);
    background-color: #f1e9d8;
}

/* В режиме открытой книги нативный скроллбар скрыт — вместо него
   JS вешает кастомный .cae-custom-scrollthumb (см. custom.js). */
body.is-fixed-header .book-scroll-content {
    scrollbar-width: none !important;
}
body.is-fixed-header .book-scroll-content::-webkit-scrollbar {
    width: 0 !important;
    display: none !important;
}

body.is-fixed-header .sidebar-scroll-inner {
    scrollbar-width: none !important;
}
body.is-fixed-header .sidebar-scroll-inner::-webkit-scrollbar {
    width: 0 !important;
    display: none !important;
}

/* Буферная полоса низа: под неё уходит текст при прокрутке. Стоит РОВНО на
   прибитом футере (заказчик 28.09.2026), поэтому bottom = его высота. */
body.is-fixed-header::after {
    content: "";
    position: fixed;
    left: 0;
    right: 8px;
    bottom: var(--narrow-footer-h, 34px);
    height: 1em;
    background-color: #f1e9d8;
    z-index: 3;
    pointer-events: none;
}

/* Футер в книге стоит последним в .book-scroll-content, и на дне прокрутки его
   нижние 14 px закрывала заглушка выше (жалоба 27.09.2026: «обрезан футер»,
   замер на 178 — голубой полосы 20 px из 34). Поднять футер над заглушкой
   нельзя: .book-scroll-content — свой стаконтекст с z-index 0, а заглушка
   лежит над ним. Поэтому резервируем под неё место — на дне прокрутки футер
   заканчивается ровно там, где начинается полоса. Высота та же, что у неё. */
/* Высота узкого футера одним числом: ею пользуются буферные полосы над ним и
   отступы снизу у прокрутки. Строка 24px + поля 5/5, на телефоне 18 + 7/8. */
body {
    --narrow-footer-h: 30px;
}

@media (max-width: 871px) {
    body {
        --narrow-footer-h: 32px;
    }
}

/* Место под футер на страницах БЕЗ книжного слоя (статьи «онас»/«оцае»,
   обложка книги, Home). ⚠️ ТОЛЬКО на том, что реально прокручивается: на
   десктопе это .content-wrapper, на телефоне .page (правило ниже, в
   медиазапросе). Раньше отступ стоял на обоих сразу, а они вложены — 46px
   набегало дважды, и внизу статьи появлялось лишнее поле (жалоба 29.09.2026;
   замер: на 176 от последней строки до низа окна 50px, на 178 до верха футера
   стало 128px).
   ⚠️ Ровно высота футера, без буфера: буферная полоса для того и нужна, чтобы
   текст уходил ПОД неё. */
body:not(.is-fixed-header) .content-wrapper {
    padding-bottom: var(--narrow-footer-h);
}

/* Место под футер И буферную полосу над ним: иначе последняя строка текста и
   последний пункт оглавления на дне прокрутки остаются под ними. */
body.is-fixed-header .book-scroll-content,
body.is-fixed-header .sidebar-scroll-inner {
    padding-bottom: calc(var(--narrow-footer-h) + 14px);
}

body.is-fixed-header hr {
    display: none !important;
}

.page p {
    text-indent: 20px;
}

/* === Межабзацные отступы в книгах ЖЭ (ТЗ 07.08.2026) ===
   Модель вёрстки книг ЖЭ: ВНУТРИ нумерованного параграфа абзацы идут вплотную,
   границу задают только красная строка (text-indent выше) и — между параграфами —
   абзац-разделитель '<p>&nbsp;</p>' (tools/insert_verse_separators.py).
   У <p> по умолчанию margin-block-end: 1em; раньше обнулялся только -start
   (правило `p { margin-block-start: 0 }` ниже), поэтому:
     • внутри параграфа висел лишний зазор («Община 1926», «Агни-Йога»);
     • разделитель давал ДВЕ пустые строки вместо одной («Урга»);
     • в предисловии книг были те же лишние зазоры.
   Обнуляем -end → разделитель = ровно одна пустая строка.
   ⚠️ Скоуп ТОЛЬКО книги «Учения Живой Этики» (класс `zhe-book` вешает custom.js
   по пути книги). 08.08.2026: правило было заскоуплено на ВСЕ книги ru — и снесло
   межабзацные отступы в дневниках (Алтай, По тропам, Фосдик, Развенчанный Тибет),
   где вёрстка была верной и разделителей нет. «Руководство» (.guide-page) тоже
   не трогаем. */
body.zhe-book .book-scroll-content p {
    margin-block-end: 0;
}

body.is-fixed-header .page p,
body.is-fixed-header .page li {
    font-size: 1.6rem;
}

/* Сайдбар для книг на мобилке */
@media (max-width: 917px) {
    /* top/height — от реальной высоты навбара (см. блок «Рамка оглавления»):
       зашитые 33px при мобильном навбаре в 72px прятали верхний бордер
       оглавления под шапку, а низ уезжал за край экрана. */
    body.is-fixed-header .sidebar.d-flex.flex-column.relative {
        position: fixed !important;
        top: calc(var(--navbar-height, 72px) + var(--toc-top-gap)) !important;
        left: 0 !important;
        width: 83vw !important;
        max-width: 83vw !important;
        /* Низ пришпилен к вьюпорту, а НЕ посчитан от 100vh (21.08.2026):
           Chrome на Android считает 100vh по «большому» вьюпорту — тому,
           что остаётся при УБРАННОЙ адресной строке. Пока строка видна,
           панель оказывалась выше экрана на её высоту, и нижний бордер
           вместе с буферной полоской уезжали за нижнюю кромку: текст
           оглавления просто обрывался краем экрана. `bottom: 0` у
           fixed-элемента считается от layout viewport, который меняется
           вместе с адресной строкой, поэтому низ всегда на месте.
           ⚠️ С 28.09.2026 отсчёт не от нуля, а от высоты прибитого футера:
           иначе полоса футера закрывает нижнюю буферную полоску
           (.sidebar::after) и нижний бордер оглавления. */
        bottom: var(--narrow-footer-h, 30px) !important;
        height: auto !important;
        z-index: 3001 !important;
    }

    body.is-fixed-header #page-wrapper:not([data-sidebar-hidden="hidden"]) .sidebar.d-flex.flex-column.relative {
        transform: translateX(0) !important;
        transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.8s !important;
    }

    body.is-fixed-header #page-wrapper[data-sidebar-hidden="hidden"] .sidebar.d-flex.flex-column.relative {
        transform: translateX(-100%) !important;
        transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.8s !important;
    }

    body.is-fixed-header .sidebar-toc-toggle {
        z-index: 3002 !important;
    }

    .navbar {
        z-index: 4000 !important;
    }
}

/* Сдвиг контента под реальную ширину сайдбара (300px) */
.page-wrapper.with-sidebar > .content-wrapper {
    left: 300px;
    width: calc(100% - 300px);
}

.page-wrapper.with-sidebar[data-sidebar-hidden] > .content-wrapper {
    left: 0;
    width: 100%;
}

.parent-sidebar-menu > li {
    padding-left: 0.5rem;
}



div#column-main.col-xl-9 ol li,
div#column-main.col-xl-9 ul li {
    text-indent: 0;
}

/* === Сноски: стрелка ↩ в конце текста, подчёркнутая === */
a.cae-backref {
    text-decoration: underline;
    margin-left: 0.3em;
    color: #02f !important;
}

/* Прячем оригинальную стрелку-иконку до обработки JS */
.footnote-list li > a.footnote:first-child {
    display: none;
}

p {
    margin-block-start: 0;
}

/* Мобильные размеры шрифтов шапки */
@media (max-width: 432px) {
    /*body.is-fixed-header .sticky-book-header h1 {*/
    /*    font-size: 17px !important;*/
    /*    margin-bottom: 0 !important;*/
    /*}*/
    /*body.is-fixed-header .sticky-book-header h2 {*/
    /*    font-size: 15px !important;*/
    /*    line-height: 1.2 !important;*/
    /*}*/
    /*body.is-fixed-header .sticky-book-header {*/
    /*    padding-bottom: 0.3em !important;*/
    /*}*/
    .date-place-row {
        font-size: 13px !important;
    }
}


/* Буферные полоски сверху (под хэдером) и снизу (у низа экрана) статей
   «О ЦАЭ» и «О проекте» — фиксированные, выше контента по z-index.
   right: 0 + height ≥ 20px — полоски прикрывают и зону скроллбара
   тоже, включая button-резерв Chromium (~16-18px), чтобы спрятать
   нативные стрелки/пустые места скроллбара, которые иначе видны
   сверху/снизу трека. */
body.is-about-cae .page::before,
body.is-about-cae .page::after,
body.is-about-page .page::before,
body.is-about-page .page::after {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    height: 16px;
    z-index: 10;
    pointer-events: none;
}

body.is-about-cae .page::before,
body.is-about-page .page::before {
    top: var(--navbar-height, 50px);
}

/* Буферная полоса низа стоит РОВНО на прибитом футере (заказчик 28.09.2026):
   текст уходит под буфер, а не под голубую полосу. */
body.is-about-cae .page::after,
body.is-about-page .page::after {
    bottom: var(--narrow-footer-h);
}

body.is-about-cae .page::before,
body.is-about-cae .page::after {
    background-color: #d0eeff;
}

body.is-about-page .page::before,
body.is-about-page .page::after {
    background-color: #c8faff;
}

/* === О проекте === */
body.is-about-page .page p {
    text-indent: 20px;
}

body.is-about-page .page p strong {
    /*display: inline-block;*/
    /*text-indent: -16px;*/
}

body.is-about-page blockquote p {
    text-indent: 0;
}

/* Ссылки в статьях О ЦАЭ и О Проекте — единый цвет в любой теме */
body.is-about-cae .page a,
body.is-about-page .page a {
    color: #1890ff !important;
}

/* Скрыть нативный скроллбар у #content-wrapper на статьях
   О ЦАЭ / О проекте — его место занимает кастомный thumb
   (см. custom.js → installCustomScrollbar), который умеет доходить
   до самого верха и низа экрана. */
body.is-about-cae #content-wrapper,
body.is-about-page #content-wrapper {
    scrollbar-width: none !important;
}
body.is-about-cae #content-wrapper::-webkit-scrollbar,
body.is-about-page #content-wrapper::-webkit-scrollbar {
    width: 0 !important;
    display: none !important;
}

/* Кастомный ползунок: позиции (top/height/right) выставляет JS,
   здесь — только внешний вид. */
.cae-custom-scrollthumb,
#cae-custom-scrollthumb {
    position: fixed;
    right: 0;
    width: 8px;
    background-color: #666666;
    border-radius: 4px;
    z-index: 20;
    cursor: pointer;
    pointer-events: auto;
    display: none;
}

/* Ползунок оглавления должен быть выше самого сайдбара
   (z:2000 на десктопе, 3001 на мобиле — см. правила .sidebar выше). */
#cae-sidebar-scrollthumb {
    z-index: 3010;
}

/* 15.08.2026 (мобилка) → 19.08.2026 (и десктоп, по ТЗ): ползунок ОГЛАВЛЕНИЯ
   книг и руководства мимикрирует под системный оверлейный — тонкий и гаснет
   через 0.8s после остановки прокрутки (класс .cae-thumb-visible вешает и
   снимает custom.js → poke()). На десктопе он дополнительно зажигается при
   наведении мыши на оглавление — иначе невидимую полоску не поймать курсором.
   Нативный скроллбар вместо него не вернуть: его вид и само наличие у
   Chrome/Safari/Firefox разные, а у нас он вдобавок скрыт правилами выше.
   ⚠️ Класс .cae-thumb-autohide вешается ТОЛЬКО на #cae-sidebar-scrollthumb
   (4-й аргумент installCustomScrollbar). Остальные ползунки — текст книги,
   .page, #content-wrapper — не трогаем: 8px, видны постоянно, как раньше.
   ⚠️ Селектор с ID, а не просто класс: ширина 8px задана через
   #cae-custom-scrollthumb — одного класса не хватило бы её перебить. */
#cae-sidebar-scrollthumb.cae-thumb-autohide {
    width: 4px;
    border-radius: 2px;
    opacity: 0;
    transition: opacity 0.35s ease;
}

#cae-sidebar-scrollthumb.cae-thumb-autohide.cae-thumb-visible {
    opacity: 1;
}

/* Скрыть permalink-якорь у h1/h2, но оставить в DOM для otterwiki scroll-spy */
.page h1 a.anchor.cae-hidden-anchor,
.page h2 a.anchor.cae-hidden-anchor {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    pointer-events: none;
    opacity: 0;
}

/* В книгах (но не в Руководстве и не в статьях) прячем permalink-якорь
   у H3. Otterwiki вставляет <a class="anchor"> в начале каждого
   заголовка; JS добавляет класс cae-hidden-anchor только для h1/h2,
   поэтому здесь таргечу a.anchor напрямую. Якорь нужен otterwiki.js
   scroll-spy (читает .anchor[0].href), поэтому удалить нельзя —
   только спрятать inline-местом, иначе короткая римская цифра уезжает
   влево от центра. */
body.is-book-page:not(.guide-page) .book-scroll-content h3 a.anchor {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    pointer-events: none;
    opacity: 0;
}
.page ul{
    padding-left: 24px !important;
    list-style-position: outside;
}
.sticky-book-header{
    padding-bottom: 10px;
}

/* Руководство: убрать красную строку у H2 и подписей под фото */
body.guide-page .page h2,
body.guide-page .page center,
body.guide-page .page center p,
body.guide-page .page center strong {
    text-indent: 0 !important;
}

/* === Mobile typography & paddings: только «Книги» и «Руководство» === */
@media (max-width: 917px) {
    body.is-fixed-header #column-main,
    body.is-fixed-header .col-xl-9 {
        padding-left: 38px !important;
        padding-right: 12px !important;
    }

    body.guide-page #column-main,
    body.guide-page .col-xl-9 {
        padding-left: 34px !important;
        padding-right: 34px !important;
    }

    body.is-about-cae .page-wrapper.with-sidebar > .content-wrapper,
    body.is-about-page .page-wrapper.with-sidebar > .content-wrapper {
        left: 0 !important;
        width: 100% !important;
    }

    body.is-about-cae .page,
    body.is-about-page .page {
        position: fixed !important;
        top: var(--navbar-height, 50px) !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding-top: 17px !important;
        padding-right: 34px !important;
        /* Место под прибитый футер: на телефоне прокручивается именно
           .page (замер 28.09.2026). Ровно высота футера — под буферную полосу
           текст уходит намеренно. */
        padding-bottom: var(--narrow-footer-h) !important;
        padding-left: 34px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    /* Нативный скроллбар .page скрыт — вместо него JS вешает кастомный
       #666 ползунок .cae-custom-scrollthumb (cae-page-scrollthumb),
       идентичный десктопному (см. custom.js → installCustomScrollbar). */
    body.is-about-cae .page,
    body.is-about-page .page {
        scrollbar-width: none !important;
    }
    body.is-about-cae .page::-webkit-scrollbar,
    body.is-about-page .page::-webkit-scrollbar {
        width: 0 !important;
        display: none !important;
    }

    body.is-about-cae .page blockquote,
    body.is-about-page .page blockquote {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    body.is-about-cae .page h1,
    body.is-about-page .page h1 {
        font-size: 16px !important;
    }

    body.is-about-cae .page h2,
    body.is-about-page .page h2 {
        font-size: 14px !important;
    }

    body.is-about-cae .page,
    body.is-about-cae .page p,
    body.is-about-cae .page li,
    body.is-about-cae .page blockquote,
    body.is-about-cae .page blockquote p,
    body.is-about-cae .page figcaption,
    body.is-about-cae .page center strong,
    body.is-about-page .page,
    body.is-about-page .page p,
    body.is-about-page .page li,
    body.is-about-page .page blockquote,
    body.is-about-page .page blockquote p,
    body.is-about-page .page figcaption,
    body.is-about-page .page center strong {
        font-size: 12px !important;
    }

    body.is-fixed-header .book-scroll-content {
        padding-left: 34px !important;
        padding-right: 34px !important;
    }

    body.is-fixed-header .sticky-book-header {
        margin-left: -38px !important;
        margin-right: -10px;
        padding-left: 38px;
        padding-right: 20px;
    }

    body.is-fixed-header:not(.guide-page) .sticky-book-header h1,
    body.is-fixed-header:not(.guide-page) .sticky-book-header h2 {
        transform: translateX(-11px);
    }

    body.is-fixed-header .page h1,
    body.is-fixed-header .sticky-book-header h1,
    body.guide-page .page h1 {
        font-size: 16px !important;
    }

    body.is-fixed-header .page h2,
    body.is-fixed-header .sticky-book-header h2,
    body.guide-page .page h2 {
        font-size: 14px !important;
    }

    /* H3 в книгах (но не в Руководстве) на мобилке — как H2 */
    body.is-book-page:not(.guide-page) .book-scroll-content h3 {
        font-size: 14px !important;
    }

    body.is-fixed-header .page p,
    body.is-fixed-header .page li,
    body.guide-page .page p,
    body.guide-page .page li {
        font-size: 12px !important;
    }

    body.is-fixed-header .page blockquote p,
    body.guide-page .page blockquote p {
        font-size: 12px !important;
    }

    body.is-fixed-header .page center strong,
    body.guide-page .page center strong {
        font-size: 12px !important;
    }
}

/* Подписи под фото авторов (.roerich-portraits) на страницах
   «О ЦАЭ» и «О проекте» — 16px, перебивает мобильный 12px */
body.is-about-cae .page .roerich-portraits strong,
body.is-about-page .page .roerich-portraits strong {
    font-size: 16px !important;
}

body.guide-page .sticky-book-header {
    padding-top: 11px;
    padding-bottom: 16px;
}

body.guide-page .page h2,
body.guide-page .page h3 {
    margin-block-start: 0.2em;

}
@media (max-width: 918px) {
    body.is-about-cae .page .roerich-portraits strong,
    body.is-about-page .page .roerich-portraits strong {
        font-size: 12px !important;
    }
}
@media (min-width: 918px) {
    body.guide-page.is-fixed-header .book-scroll-content {
        top: calc(9px + var(--book-header-gap, 0px)) !important;
        padding-top: calc(var(--book-header-height, 0px) - var(--book-header-gap, 0px)) !important;
    }
}



@media (max-width: 917px) {
    .sidebar-toc-toggle:hover {
        background: #f1e9d8 !important;
    }

    body.guide-page.is-fixed-header .book-scroll-content {
        padding-left: 34px !important;
        padding-right: 34px !important;
    }

    body.guide-page.is-fixed-header .sticky-book-header {
        margin-left: -34px !important;
        margin-right: -34px !important;
        padding-left: 34px;
        padding-right: 34px;
    }
    body.guide-page .book-scroll-content {
        /* ⚠️ Было жёстко `top: 46px`, и это «съедало» первые строки текста
           (жалоба 07.08.2026, скриншот «Руководства» на узком экране).
           padding-top контейнера = --book-header-height, а она считается в JS как
           `низ шапки − ВЫСОТА НАВБАРА`. Значит верх контейнера обязан отсчитываться
           от навбара же. На узком экране навбар переносится на 2–3 строки и
           становится выше 46px → контент начинался ВЫШЕ низа шапки ровно на
           (высота навбара − 46) и уходил под неё.
           46px = 30px (навбар в одну строку) + 16px зазора, поэтому при однострочном
           навбаре вид не меняется, а при переносе отступ едет вместе с ним. */
        top: calc(var(--navbar-height, 30px) + 16px);
        scroll-padding-top: var(--book-header-height, 0px);
    }
}

@media (max-width: 917px) {
    .cae-nav-logo {
        position: fixed;
        width: 64px !important;
        top: 1px;
        left: 2px;
        z-index: 9999;
        opacity: 0.95;
        filter: drop-shadow(rgb(255, 255, 255) 0px 2px 4.5px) drop-shadow(rgb(255, 255, 255) 0px 2px 4.5px) drop-shadow(rgba(255, 255, 255, 0.5) 0px 2px 4.5px);
        transition: transform 0.3s;
    }
}


/* === EasyMDE === */
:root {
    /* Фолбэк-объявления для переменных, которые переопределяются из JS */
    --cae-mde-split: 50%;
    --navbar-height: 55px;
}
.cae-mde-toggle {
    display: inline-block;
    margin: 8px 0;
    padding: 6px 12px;
    background: #42a5f5;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 13px;
    cursor: pointer;
}
.cae-mde-toggle:hover {
    background: #1e88e5;
}

/* Когда WYSIWYG активен (класс cae-mde-enabled на <html>, cae-mde-active на <body>):
   разворачиваем Otter-обёртки на всю ширину viewport и глушим горизонтальный скролл
   на всех уровнях — Halfmoon держит скролл на #content-wrapper, а не на body. */
html.cae-mde-enabled,
html.cae-mde-enabled body,
html.cae-mde-enabled #page-wrapper,
html.cae-mde-enabled #content-wrapper,
html.cae-mde-enabled .content-wrapper,
html.cae-mde-enabled #column-main,
html.cae-mde-enabled .page,
html.cae-mde-enabled .content,
html.cae-mde-enabled form {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}
html.cae-mde-enabled .content-wrapper,
html.cae-mde-enabled #column-main,
html.cae-mde-enabled .page,
html.cae-mde-enabled .content {
    max-width: none !important;
    width: auto !important;
    left: 0 !important;
    right: 0 !important;
    flex: 1 1 auto !important;
}
html.cae-mde-enabled #column-main {
    padding-left: 10px !important;
    padding-right: 10px !important;
}
/* Otter/Halfmoon сайдбар на edit-странице отъедает ~300px слева —
   скрываем его, чтобы split занимал действительно всю ширину. */
html.cae-mde-enabled .sidebar,
html.cae-mde-enabled .sidebar-overlay {
    display: none !important;
}
html.cae-mde-enabled #page-wrapper.with-sidebar .content-wrapper,
html.cae-mde-enabled #page-wrapper[data-sidebar-hidden="hidden"] .content-wrapper {
    left: 0 !important;
}
html.cae-mde-enabled .EasyMDEContainer,
html.cae-mde-enabled .EasyMDEContainer * {
    box-sizing: border-box;
}
html.cae-mde-enabled .EasyMDEContainer {
    max-width: 100% !important;
    /* Контейнер тянем от навбара до низа окна минус sticky-полоса действий
       (--cae-mde-actions-h, задаётся из JS). Без фиксированной высоты
       абсолютно-позиционированные .CodeMirror/.editor-preview-side не знают,
       до куда растягиваться — и 500px min-height заставляет форму «уезжать»
       за сгиб. */
    height: calc(100vh - var(--navbar-height, 55px) - var(--cae-mde-actions-h, 0px)) !important;
    margin-bottom: 0 !important;
    position: relative !important;
}
html.cae-mde-enabled .editor-toolbar {
    flex-wrap: wrap;
}

/* Split-view: две панели со своим внутренним скроллом, каждая — во всю высоту. */
.EasyMDEContainer .CodeMirror {
    min-height: 500px;
}
/* Высоту считаем через top+bottom, а не calc(100vh - …) — так положение
   панелей не зависит от высоты navbar и всегда совпадает со сплиттером.
   ВАЖНО: EasyMDE по дефолту даёт .CodeMirror только float+height:100%,
   без position:absolute — тогда top/bottom/left/width ниже ничего не делают,
   а height:auto коллапсит панель в 0. Ставим position:absolute руками. */
.EasyMDEContainer.sided--no-fullscreen .CodeMirror,
.EasyMDEContainer.sided--no-fullscreen .editor-preview-side {
    position: absolute !important;
    float: none !important;
    top: var(--cae-split-top, 50px) !important;
    bottom: var(--cae-split-bottom, 0px) !important;
    height: auto !important;
    min-height: 400px;
}

/* Ширины панелей — через CSS-переменную, двигаются сплиттером.
   left+right+width=auto: ширина считается из разницы, поэтому panels
   реально сужаются/расширяются при движении сплиттера, а не просто
   сдвигаются (что делает дефолтный width: 50% от EasyMDE). */
.EasyMDEContainer.sided--no-fullscreen .CodeMirror {
    left: 0 !important;
    right: auto !important;
    width: var(--cae-mde-split, 50%) !important;
}
.EasyMDEContainer.sided--no-fullscreen .editor-preview-side {
    left: var(--cae-mde-split, 50%) !important;
    right: 0 !important;
    width: auto !important;
}

/* Убираем дефолтный border-left у preview-side — иначе двойная линия:
   рамка preview + наш сплиттер-линия. */
.EasyMDEContainer.sided--no-fullscreen .editor-preview-side {
    border-left: 0 !important;
}

/* Draggable splitter: широкая невидимая hit-zone + тонкая видимая линия
   ровно на границе панелей. Пользователь «цепляет» визуальное разделение. */
.cae-mde-splitter {
    position: absolute;
    top: var(--cae-split-top, 50px);
    bottom: var(--cae-split-bottom, 0px);
    left: var(--cae-mde-split, 50%);
    width: 14px;
    margin-left: -7px;
    background: transparent;
    cursor: col-resize;
    z-index: 100;
    touch-action: none;
}
.cae-mde-splitter::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 1px;
    margin-left: -0.5px;
    background: #ccc;
    pointer-events: none;
    transition: background 0.15s, width 0.15s, margin-left 0.15s;
}
.cae-mde-splitter:hover::before,
.cae-mde-splitter.cae-mde-splitter--active::before {
    background: #42a5f5;
    width: 3px;
    margin-left: -1.5px;
}
/* Показываем только когда split-view активен */
.EasyMDEContainer:not(.sided--no-fullscreen) .cae-mde-splitter {
    display: none;
}

/* EasyMDE прячет оригинальный textarea через inline style, но что-то в Otter
   его перебивает. Страхуемся !important когда WYSIWYG активен. */
html.cae-mde-enabled form textarea#content_editor,
html.cae-mde-enabled form textarea[name="content_editor"],
html.cae-mde-enabled .EasyMDEContainer > textarea {
    display: none !important;
}

/* В WYSIWYG-режиме превью получает класс .page, и fixed-маски .page::before/::after
   со страниц «О ЦАЭ» / «О проекте» рисуются поверх обеих панелей редактора. */
html.cae-mde-enabled body.is-about-cae .page::before,
html.cae-mde-enabled body.is-about-cae .page::after,
html.cae-mde-enabled body.is-about-page .page::before,
html.cae-mde-enabled body.is-about-page .page::after {
    display: none !important;
}

/* Preview: наследуем шрифты сайта */
.editor-preview,
.editor-preview-side {
    font-family: "Literata", serif;
    background: #fff;
}

/* Preview-панель получает класс .page из JS (buildPreviewRender) —
   большинство правил custom.css заскоупнуто на .page / .page p / .page h1
   и применится автоматически. Здесь задаём базовые отступы колонки,
   которые в боевой странице приходят от #column-main. */
.editor-preview.page,
.editor-preview-side.page {
    padding: 17px 30px 20px 30px !important;
    font-family: Literata, serif !important;
    text-align: justify;
}
/* Для страниц книги /books/ru/ — крупнее шрифт, как на боевой (аналог
   body.is-fixed-header .page p). Выставляем руками через вспомогательный
   класс, чтобы не тащить body.is-fixed-header (он ломает layout). */
.editor-preview-side.is-fixed-header-preview p,
.editor-preview-side.is-fixed-header-preview li,
.editor-preview.is-fixed-header-preview p,
.editor-preview.is-fixed-header-preview li {
    font-size: 1.6rem;
}
.editor-preview-side.is-fixed-header-preview hr,
.editor-preview.is-fixed-header-preview hr {
    display: none;
}

/* Toolbar sticky под navbar */
.EasyMDEContainer .editor-toolbar {
    position: sticky;
    top: var(--navbar-height, 55px);
    background: #fafafa;

}

/* Компактный тулбар: уменьшаем высоту, паддинги и размер кнопок/иконок.
   Кнопки остаются все 17 — меняется только визуальный масштаб. */
.EasyMDEContainer .editor-toolbar {
    padding: 2px 6px;
    min-height: 0;
    line-height: 1;
}
.EasyMDEContainer .editor-toolbar button {
    width: 24px;
    height: 24px;
    padding: 2px;
    margin: 0 1px;
    line-height: 20px;
}
.EasyMDEContainer .editor-toolbar button::before,
.EasyMDEContainer .editor-toolbar button .fa {
    font-size: 13px;
    line-height: 20px;
}
.EasyMDEContainer .editor-toolbar i.separator {
    height: 18px;
    margin: 0 4px;
}

/* === Sticky-полоса кнопок действий формы (Save / Cancel / etc.) ===
   Otter-шаблон кладёт кнопки в конец формы, при полноэкранном редакторе
   они уезжают ниже сгиба. Переводим их в fixed-полосу внизу окна, чтобы
   были видны всегда. Высоту полосы JS записывает в --cae-mde-actions-h
   — .EasyMDEContainer учитывает её в своей calc-высоте (см. выше). */
html.cae-mde-enabled .cae-mde-form-actions {
    position: fixed !important;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 11;
    background: #fafafa;
    border-top: 1px solid #ccc;
    padding: 6px 12px;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
    box-sizing: border-box;
    box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.06);
}
/* Все «вторичные» кнопки/ссылки в полосе — серые (Cancel, ссылки-назад,
   чекбоксы minor-edit и т.п.). Save (btn-primary / type=submit) остаётся
   синим через Otter-дефолты — его не перекрываем. */
html.cae-mde-enabled .cae-mde-form-actions a.btn,
html.cae-mde-enabled .cae-mde-form-actions button:not([type="submit"]):not(.btn-primary) {
    background: #e0e0e0 !important;
    color: #333 !important;
    border: 1px solid #bbb !important;
    text-decoration: none !important;
}
html.cae-mde-enabled .cae-mde-form-actions a.btn:hover,
html.cae-mde-enabled .cae-mde-form-actions button:not([type="submit"]):not(.btn-primary):hover {
    background: #d0d0d0 !important;
}
/* Подписи/инпуты (commit message) — читаемые на светлом фоне */
html.cae-mde-enabled .cae-mde-form-actions label,
html.cae-mde-enabled .cae-mde-form-actions span {
    color: #333;
}
html.cae-mde-enabled .cae-mde-form-actions input[type="text"] {
    background: #fff;
    color: #333;
    border: 1px solid #bbb;
    padding: 4px 8px;
    border-radius: 3px;
}

/* Otter Wiki создаёт свой CodeMirror из textarea #content_editor.
   Наш EasyMDE делает fromTextArea на том же textarea, поэтому свой
   CodeMirror кладёт внутрь .EasyMDEContainer. Итого в DOM — ДВА
   CodeMirror'а: Otter'овский и наш. Скрываем Otter'овский через атрибут
   data-cae-hidden, который JS навешивает на cm_editor.getWrapperElement(). */
html.cae-mde-enabled [data-cae-hidden="otter-cm"] {
    display: none !important;
}
html.cae-mde-enabled div.CodeMirror.cm-s-otterwiki.CodeMirror-wrap {
    display: none !important;
}

/* Скрываем нижнюю панель только когда включен наш WYSIWYG */
html.cae-mde-enabled .editor-bottom-panel {
    display: none !important;
}

.CodeMirror{
    background:white !important;
}
.fa-window-close:before{
    content: "\f410" !important;
}

@media (max-width: 917px) {
    .page ul {
        margin-left: 0 !important;
        margin-inline-start: 0 !important;
        padding-inline-start: 18px !important;
        list-style-position: outside !important;
    }
}

/* === Unified Find (Ctrl+F) ============================================ */
/* Страховка: если harvestSourceMarkers по какой-то причине не сработал —
   плашки остаются в DOM. Прячем их, чтобы не мельтешили. */
.editor-preview-side .cae-srcmark,
.editor-preview .cae-srcmark {
    display: none !important;
}

.cae-find-panel {
    display: none;
    position: absolute;
    top: 8px;
    right: 12px;
    z-index: 200;
    background: #fff;
    border: 1px solid #bbb;
    border-radius: 4px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
    padding: 4px 6px;
    gap: 4px;
    align-items: center;
    font-size: 13px;
    font-family: "Noto Sans", sans-serif;
    color: #222;
}
.cae-find-panel.cae-find-panel--open {
    display: inline-flex;
}
.cae-find-panel .cae-find-input {
    width: 220px;
    padding: 4px 8px;
    border: 1px solid #bbb;
    border-radius: 3px;
    background: #fff;
    color: #222;
    font: inherit;
    outline: none;
}
.cae-find-panel .cae-find-input:focus {
    border-color: #42a5f5;
    box-shadow: 0 0 0 2px rgba(66, 165, 245, 0.25);
}
.cae-find-panel .cae-find-counter {
    min-width: 48px;
    text-align: center;
    color: #555;
    font-variant-numeric: tabular-nums;
    user-select: none;
}
.cae-find-panel .cae-find-btn {
    background: #f1f1f1;
    border: 1px solid #bbb;
    border-radius: 3px;
    width: 26px;
    height: 26px;
    line-height: 1;
    padding: 0;
    font-size: 13px;
    color: #333;
    cursor: pointer;
}
.cae-find-panel .cae-find-btn:hover {
    background: #e2e2e2;
}
.cae-find-panel .cae-find-btn:active {
    background: #d5d5d5;
}
.cae-find-panel .cae-find-close {
    margin-left: 2px;
}

/* Подсветки совпадений: одинаковый цвет в MD (CodeMirror .markText) и preview */
.CodeMirror .cae-search-hit,
.editor-preview-side mark.cae-search-hit,
.editor-preview mark.cae-search-hit {
    background: #fff59d;
    color: inherit;
    padding: 0;
    border-radius: 1px;
}
.CodeMirror .cae-search-hit--active,
.editor-preview-side mark.cae-search-hit--active,
.editor-preview mark.cae-search-hit--active {
    background: #ffb300;
    color: #000;
    outline: 1px solid #e65100;
}

/* Скрываем заголовок "Page Index" и тумблер "Toggle page headings" на странице индекса книг */
h1:has(label[for="switch-headings"]),
h1:has(#switch-headings),
h2:has(label[for="switch-headings"]),
h2:has(#switch-headings),
h2.pr-20.d-inline-block {
    display: none !important;
}

#switch-headings,
label[for="switch-headings"] {
    display: none !important;
}

/* Тач-устройства (телефоны и планшеты): ползунок — ТОЛЬКО индикатор.
   Никаких pointer-events: пальцем 8px-полоску всё равно не поймать, а
   перехватывать касания над текстом/картинками она не должна.
   ⚠️ История: 06.07.2026 кастомные ползунки на таче отключили целиком
   (вместо них «возвращали» нативные) — но нативные скроллбары на таче
   невидимы (overlay/авто-скрывающиеся), а у .page мобильных статей они
   ещё и скрыты в CSS выше, поэтому индикатора прокрутки не осталось
   вовсе: сначала на планшетах (починено 23.07 сужением гейта до ≤917px),
   затем это же нашли на телефонах. С 05.08.2026 ползунки работают везде,
   а зависание ползунка оглавления над текстом лечится в JS
   (custom.js → installCustomScrollbar: scrollerHidden + пересчёт по
   смене data-sidebar-hidden). Возврат нативных скроллбаров отсюда убран —
   они прятались правилами выше не просто так. */
@media (pointer: coarse) {
    .cae-custom-scrollthumb {
        pointer-events: none !important;
        cursor: default !important;
    }

    /* На таче нативный скроллбар #content-wrapper/.page всё равно невидим
       (overlay), а на обычных вики-страницах мы теперь рисуем поверх свой
       ползунок — прячем нативный, чтобы на планшете не мелькали две
       полоски рядом. На десктопе (fine pointer) нативный остаётся как был. */
    #content-wrapper,
    .page {
        scrollbar-width: none !important;
    }
    #content-wrapper::-webkit-scrollbar,
    .page::-webkit-scrollbar {
        width: 0 !important;
        display: none !important;
    }
}
/* ============================================================
   Переключатель языка в вики (docs/i18n_yandex.md, этап 5)
   ============================================================
   Живёт внутри #cae-nav-source, который custom.js подставляет вместо
   .navbar-brand, поэтому едет вместе с навигацией.

   Свой класс .cae-lang-switch, а НЕ .lang-switch с карты: у карты этот
   блок позиционирован absolute/right:20px под её 30-пиксельную шапку, в
   вики шапка другая. Кнопки — тот же .cae-lang-btn, что и на карте.

   Скрыт по умолчанию: показывается только когда i18n.js подтвердил, что
   сервис перевода включён (data-i18n-ready на <html>). Мёртвая кнопка
   «EN» хуже её отсутствия. */
.cae-lang-switch {
    display: none;
    gap: 2px;
    /* ВНЕ ПОТОКА — как на карте. В потоке (`margin-left: auto`) переключатель
       съедал всё свободное место (замер: 562px), и логотип с меню прижимались
       влево вместо центра, заданного `justify-content: center` у #cae-custom-nav.
       Containing block — .navbar (у него position: fixed). */
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    /* !important: .navbar * { background-color: transparent !important }
       иначе съедает фон пилюли. */
    background-color: rgba(255, 255, 255, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 20px;
    padding: 3px;
}

html[data-i18n-ready] .cae-lang-switch {
    display: flex;
}

.cae-lang-switch .cae-lang-btn {
    background: none;
    border: 0;
    color: #fff;
    border-radius: 15px;
    padding: 2px 9px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.cae-lang-switch .cae-lang-btn:hover:not(.active) {
    background-color: rgba(255, 255, 255, 0.25);
}

@media (max-width: 917px) {
    /* Навбар вики здесь 72px, меню — колонка из трёх строк. По центру
       переключатель оказался бы напротив второй строки, поэтому прижимаем
       к верхней (как на карте). */
    .cae-lang-switch {
        top: 6px;
        transform: none;
        right: 10px;
        padding: 2px;
    }

    .cae-lang-switch .cae-lang-btn {
        padding: 1px 7px;
        font-size: 11px;
    }
}

.cae-lang-switch .cae-lang-btn.active {
    background-color: #fff !important;
    /* !important: .navbar a, .navbar button { color: white !important } красил
       активную кнопку белым по белому — текст «EN» пропадал. */
    color: #42a5f5 !important;
    cursor: default;
}

/* === Страница «Сообщество»: без бежевой подложки (ТЗ 28.08.2026) ===
   Заказчик: «бежевый в заголовке и в подвале на этой странице (только на
   сообщество) убери». Красим НЕ в transparent, а в белый (= фон body): обе
   плашки не декоративные, они маскируют текст, который проезжает под ними —
   крышка и её ::before закрывают зазор между навбаром и заголовком, а
   ::after — полосу у нижнего края окна. Прозрачные они пропускали бы строки
   текста. Скоуп — только .community-page, книги и Руководство как были. */
body.community-page .sticky-book-header,
body.community-page.dark-mode .sticky-book-header,
body.is-fixed-header.community-page .sticky-book-header::before,
body.is-fixed-header.community-page::after {
    background-color: #fff;
}

/* Кнопка-язычок оглавления на «Сообществе» не нужна — оглавления там нет.
   Сайдбар уже уехал за край (data-sidebar-hidden), но язычок торчит наружу
   (right:-32px при overflow:visible у .sidebar), поэтому гасим его отдельно. */
body.community-page .sidebar-toc-toggle {
    display: none !important;
}

/* Футер страниц вики = НИЖНЯЯ СТРОКА ФУТЕРА КАРТЫ (ТЗ 17.09.2026 ответ 10.3;
   вид уточнён заказчиком 27.09.2026: «футер такой же, как в карте, но без
   верхних двух строк; отступ сверху/снизу сохранить; цвет везде, включая
   книги, голубой»).
   Значения взяты у .map-footer: фон #42a5f5, поля 5px 12px (телефон 7/8),
   строка 12px с интерлиньяжем 24px (телефон 18px), трекинг 0.3px.
   ⚠️ БЕЗ position: fixed — прибитая к низу экрана полоса висела поверх чтения
   книг, заказчик её отменил 27.09.2026. Строка идёт в конце содержимого.
   Строку добавляет custom.js. */
.cae-wiki-footer {
  display: block;
  /* Поля 3px: со строкой 24px высота ровно 30px — как у навбара вики
     (заказчик 28.09.2026). Сверху и снизу поровну. */
  padding: 3px 12px;
  /* Тень над полосой — зеркало навбарной (та светит вниз: 0 2px 4px). */
  box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.2);
  background: #42a5f5;
  color: #fff;
  font-family: 'Noto Sans', sans-serif;
  font-size: 12px;
  line-height: 24px;
  /* ⚠️ Трекинг как у ©-строки футера карты: там --letter-spacing-tight, то
     есть -0.01em (при кегле 12px это ровно −0.12px). Переменная объявлена в
     styles.css и до вики не доходит — пишем значением. Было 0.3px, как у
     пунктов меню, и строка выходила шире карты на 14.7px из 233.7 (замер
     29.09.2026); унификация по указанию заказчика 30.09.2026. */
  letter-spacing: -0.01em;
  /* Тень — ровно как у .map-footer (заказчик 28.09.2026). */
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  /* .book-scroll-content отдаёт тексту красную строку 20px — футеру не нужна. */
  text-indent: 0;
  /* Прибит к низу окна во всю ширину на ВСЕХ страницах вики — и в книгах, и в
     статьях (заказчик 28.09.2026: «да, статьи вики тоже прибивай также»).
     Раньше строка шла в конце содержимого и её не было видно, пока не
     докрутишь. custom.js кладёт футер в BODY: внутри .book-scroll-content
     (position: fixed, z-index: 0) и внутри .page на телефоне — свои
     стаконтексты, из них полосу низа (z 3 и z 10) не перекрыть.
     z 2001: выше буферных полос и сайдбара (2000), ниже шапки (2100) —
     содержимое по-прежнему уезжает ПОД шапку. */
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2001;
}

.cae-wiki-footer a,
.cae-wiki-footer .cae-lang-foot__cur {
  color: #fff;
}

/* ⚠️ Тёмная системная тема: `.dark-mode * { color: #111 !important }` (им вики
   гасит свою тёмную тему) красил текст футера в чёрный по голубому — замер
   28.09.2026 дал rgb(17,17,17). У навбара исключение уже есть, делаем такое же
   футеру: он голубой в любой теме, текст на нём всегда белый. */
.dark-mode .cae-wiki-footer,
.dark-mode .cae-wiki-footer * {
  color: #fff !important;
}

@media (max-width: 871px) {
  /* Как в футере карты: поля 7/8, строка 18px, хвост названия скрыт — остаётся
     «RU / © 2021-2026 CAEMAP.ONLINE». */
  .cae-wiki-footer {
    /* Поровну сверху и снизу: 7 + строка 18 + 7 = 32px. */
    padding: 7px 12px;
    line-height: 18px;
    /* Как у ©-строки карты на телефоне: там трекинг normal. */
    letter-spacing: normal;
  }

  .cae-wiki-footer .cae-foot-tail {
    display: none;
  }
}