/* [2026-10-03] Slides: копия modules/fish/styles/fish.css (da4fd7ca4); правила 3D и Плана 2D
   вычищаются по перечню ТЗ. Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §4.2 (таблица «не берётся в копию»).
   Chat: slides-tz-2026-10-02. */
/* Override themes.css body padding for fish module */
body {
    padding: 0 !important;
    margin: 0;
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow: hidden;
    background-color: var(--bg-primary);
    color: var(--text-primary);
    font-family: var(--font-family);
}

/* [2026-08-16] МЕСТО ПОД НИЖНЮЮ ПАНЕЛЬ-ХЛЕБНЫЕ-КРОШКИ.
   Дефект: правая панель обрезалась нижним баннером. Причина видна прямо здесь, в двух
   строках выше:
     1. `padding: 0 !important` глушит канонический резерв
        `body.has-bottom-action-bar { padding-bottom: 70px }` (styles/bottom-action-bar.css:243),
        который ставит сам компонент баннера (components/BreadcrumbPath.js:94);
     2. `height: 100vh` + `overflow: hidden` — страница не прокручивается, поэтому нижняя
        полоса раскладки просто оказывается ПОД панелью (`position: fixed; bottom: 0;
        z-index: 1000`), а правая панель тянется на всю высоту холста и режется.
   Решение — ровно то же, что уже применено в модуле Documents для той же жалобы PO:
   вычитаем ФАКТИЧЕСКУЮ высоту панели, которую она публикует сама
   (BreadcrumbPath._publishHeight → `--bottom-bar-height`), а не подгоняем магическое число.
   Сравнить: modules/documents/css/documents.css:1159-1161 и
   modules/documents/css/pdf-documents.css:33-35.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §J. Chat: fish-icons-styles-audit-2026-08-16. */
body.has-bottom-action-bar {
    height: calc(100vh - var(--bottom-bar-height, 44px));
}

/* [2026-10-03] Правила видов 3D и План 2D сняты: в Slides этих видов нет (сцены, HUD, хотбар,
   инвентарь, состав модели, План 2D, поля «Геометрия (3D)»). Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md
   §4.2 (перечень «что не берётся в копию»: правила только для 2D и 3D). Chat: slides-tz-2026-10-02. */

/* Canvas container */
/* [2026-08-16] Снята `box-shadow` с холста. Холст — РАЗДЕЛ ЛЭЙАУТА, а железное правило PO
   от 2026-08-16 (DESIGN.md §«Лэйаут страницы», п.1) прямо запрещает разделам рамку,
   скругление, тень и собственный фон-коробку: разделы разделяются заголовком, воздухом и
   максимум одной линией. Тень давала серую полосу-обод под лентой вкладок; в тёмной теме её
   и так гасили отдельным правилом — то есть оформление уже признавали лишним.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §I. Chat: fish-icons-styles-audit-2026-08-16. */
#canvasContainer {
    background-color: var(--bg-primary);
}

/* SVG canvas */
#diagramCanvas {
    width: 100%;
    height: 100%;
    display: block;
    cursor: default;
}

/* Modal container large variant for diagrams modal */
.modal-container-lg {
    max-width: 900px;
}

/* Diagrams list styles */
/* [2026-08-16] СПИСОК ПРИВЕДЁН К КАНОНУ БРАУЗЕРА ДОКУМЕНТОВ (PDF/Word):
   modules/documents/css/document-browser.css:187-340.
   Было: каждая строка — плашка с собственным фоном `--bg-tertiary`, а справа ДВЕ постоянно
   видимые заливные кнопки (синяя «Load» + красная «Delete»). На списке из десятка диаграмм
   окно превращалось в набор цветных плашек.
   Стало, как в браузере документов: строка без собственного фона (подсветка только на
   наведении), слева иконка-плитка 40×40, дальше имя 14px/500 и мета 12px, а действия —
   иконочные кнопки 28×28 без заливки, ПОЯВЛЯЮЩИЕСЯ ПРИ НАВЕДЕНИИ на строку.
   Цвета взяты токенами: сам document-browser.css держит #f5f5f5 / #e3f2fd / #ffebee / #d32f2f
   литералами, копировать этот дефект нельзя (DESIGN.md §15.6).
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §K. Chat: fish-icons-styles-audit-2026-08-16. */
.diagram-item {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: background-color var(--transition-fast);
}

.diagram-item:hover {
    background-color: var(--bg-hover);
}

.diagram-item-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-secondary);
    border-radius: var(--radius-lg);
    color: var(--text-secondary);
}

.diagram-item-info {
    flex: 1;
    min-width: 0;
}

.diagram-item-title {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: var(--space-1);
}

.diagram-item-meta {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin: 0;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.diagram-item-actions {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-shrink: 0;
    opacity: 0;
    transition: opacity var(--transition-fast);
}

.diagram-item:hover .diagram-item-actions,
.diagram-item:focus-within .diagram-item-actions {
    opacity: 1;
}

/* [2026-08-16] Устройства БЕЗ наведения — действия строки видны всегда.
   Прежний фолбэк висел на `@media (max-width: 767px)`, то есть привязывал доступность
   к ШИРИНЕ, а не к наличию мыши: на планшете 768–1024 px (iPad — 1024) наведения нет,
   ширина больше порога, и кнопки «Открыть/Удалить» становились недостижимы вовсе —
   диаграмму нельзя было ни открыть кнопкой, ни удалить. Условие `hover: none` спрашивает
   ровно то, что нужно. Правило по ширине оставлено ниже — оно не мешает.
   Ref: код-ревью модуля Fish 2026-08-16, находка №4. Chat: spreadsheet-basic-excel-2026-08-15. */
@media (hover: none) {
    .diagram-item-actions {
        opacity: 1;
    }
}

.diagram-action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    border-radius: var(--radius-md);
    cursor: pointer;
    color: var(--text-secondary);
    transition:
        background-color var(--transition-fast),
        color var(--transition-fast);
}

.diagram-action-btn:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

.diagram-action-open:hover {
    background: rgba(var(--brand-primary-rgb), 0.12);
    color: var(--brand-primary-text);
}

.diagram-action-delete:hover {
    background: var(--color-error-bg);
    color: var(--color-error-text);
}

.empty-state {
    text-align: center;
    padding: var(--space-8) 0;
}

.empty-state-icon {
    font-size: 3rem;
    color: var(--text-tertiary);
    margin-bottom: var(--space-2);
}

.empty-state-text {
    color: var(--text-secondary);
}

.error-state {
    text-align: center;
    padding: var(--space-8) 0;
}

/* [2026-08-16] Токена --danger в проекте НЕТ (проверено по styles/themes.css) — правило
   было невалидным, и иконка с текстом ошибки наследовали обычный цвет вместо красного.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §B1. Chat: fish-icons-styles-audit-2026-08-16. */
.error-state-icon {
    font-size: 3rem;
    color: var(--color-error-text);
    margin-bottom: var(--space-2);
}

.error-state-text {
    color: var(--color-error-text);
}

.error-state-detail {
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
    margin-top: var(--space-2);
}

/* Добавляем стиль для "выбранной" кости.
    Она будет становиться красной.
*/
.bone-path.selected {
    fill: var(--color-error);
}

/* --- Стили для "Костей" (Перья с заливкой) --- */
.bone-path {
    fill: var(--color-info);
    stroke: none; /* Без обводки */
    /* [2026-09-18] Перечень вместо `all` (аудит Д1, закрытие хвоста). Это SVG-фигура: у неё
       анимируется заливка, а не краски блочной модели, поэтому `fill` назван явно.
       Ref: docs/AUDIT_UI_MOTION_2026-09-17.md Д1. Chat: ui-motion-fixes-2026-09-17. */
    transition:
        fill 0.1s ease-in-out,
        stroke 0.1s ease-in-out,
        opacity 0.1s ease-in-out,
        transform 0.1s ease-in-out;
    /* console.log("DEBUG: Bone path style applied"); */
}

/* --- Стили для прямоугольника выделения --- */
.selection-box-strict {
    pointer-events: none;
    fill: var(--color-info);
    fill-opacity: 0.1;
    stroke: var(--color-info);
    stroke-opacity: 0.8;
}

.selection-box-flexible {
    pointer-events: none;
    fill: var(--color-info);
    fill-opacity: 0.1;
    stroke: var(--color-warning);
    stroke-opacity: 0.8;
}

/* --- Стили для Точек (Root, Process, Outcome) --- */
.bone-point {
    stroke-width: 2px;
    cursor: move; /* Курсор "перемещение" */
    /* [2026-09-18] Перечень вместо `all` (аудит Д1). SVG-точка: заливка и обводка названы явно.
       `stroke-width` НЕ включена намеренно — её меняют состояния, и это геометрия фигуры.
       Ref: docs/AUDIT_UI_MOTION_2026-09-17.md Д1. Chat: ui-motion-fixes-2026-09-17. */
    transition:
        fill 0.1s ease-in-out,
        stroke 0.1s ease-in-out,
        opacity 0.1s ease-in-out,
        transform 0.1s ease-in-out;
    /* console.log("DEBUG: Bone point style applied"); */
}

.bone-point:hover {
    fill: var(--text-inverse);
    r: 8px; /* Немного увеличиваем радиус */
}

/* 1. Стиль для Root (Синий) */
.bone-point.root-point {
    fill: var(--color-info);
    stroke: var(--color-info);
}

/* 2. Стиль для Process (Оранжевый) */
.bone-point.process-point {
    fill: var(--color-warning);
    stroke: var(--color-warning);
}

/* 3. Стиль для Outcome (Зеленый) */
.bone-point.outcome-point {
    fill: var(--color-success);
    stroke: var(--color-success);
}

/* [2026-10-03] Разорванная связь: root ссылается на кость, которой нет, — точка пустая, с красной
 * обводкой, а не молча отвязанная. Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §4.2. Chat: slides-tz-2026-10-02. */
.bone-point.root-point.link-broken {
    fill: var(--bg-primary);
    stroke: var(--color-error);
    stroke-width: 3px;
    stroke-dasharray: 3 2;
}

/* Стиль для активной (перетаскиваемой) точки */
.bone-point.active {
    fill: var(--color-error);
    stroke: var(--color-error);
    r: 9px; /* Увеличиваем */
    cursor: move;
}

/* Новый стиль для 'root' точки,
 * когда 'outcome' наводится на нее для соединения.
*/
.bone-point.snap-target.root-point {
    fill: var(--color-success);
    stroke: var(--text-inverse);
    stroke-width: 3px;
    r: 10px; /* Увеличивается */
}

/* Новый стиль для 'outcome' точки,
 * когда 'root' наводится на нее для соединения.
*/
.bone-point.snap-target.outcome-point {
    fill: var(--color-info);
    stroke: var(--text-inverse);
    stroke-width: 3px;
    r: 10px; /* Увеличивается */
}

/*
 * Стиль для SVG-холста, когда включен режим рисования.
 * (Правило 11: Улучшение UI)
 */
#diagramCanvas.drawing-mode {
    cursor: crosshair;
}

/* ======================= ПЛАВАЮЩАЯ ПАНЕЛЬ ======================= */

/* [2026-08-16] Рамка 2px → 1px и фон панели → --bg-primary: плавающая панель инструментов
   должна читаться так же, как всплывающие панели модуля Documents, а не как отдельная
   «коробка» с толстым ободом. Это НЕ раздел лэйаута (плавающий инструмент), поэтому тень и
   скругление сохранены — DESIGN.md §4 «Cards & Containers».
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §I. Chat: fish-icons-styles-audit-2026-08-16. */
#floatingToolbar {
    position: fixed;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    padding: var(--space-2);
    z-index: var(--z-dropdown);
}

.floating-toolbar-drag {
    cursor: grab;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    color: var(--text-tertiary);
    font-size: var(--font-size-base);
    border-radius: var(--radius-lg);
    transition:
        background-color var(--transition-base),
        color var(--transition-base);
}

.floating-toolbar-drag:active {
    cursor: grabbing;
}

.floating-toolbar-drag:hover {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

/* [2026-08-16] Ручка перетаскивания: символ «⋮⋮» запрещён каноном PO 2026-07-09, а шрифтовый
   значок заменён контурным SVG набора модуля (`drag`, размер атрибутом svg).
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §A1;
        docs/DEV_GUIDE_FISH_TO_WORD_CONTRACT_2026-08-16.md §3 шаг 1, шаг 5.
   Chat: fish-icons-styles-audit-2026-08-16. */

.floating-toolbar-close-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    color: var(--text-secondary);
    cursor: pointer;
    border-radius: var(--radius-lg);
    transition:
        background-color var(--transition-base),
        color var(--transition-base);
}

.floating-toolbar-close-btn:hover {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

.floating-toolbar-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--space-2);
    flex-wrap: nowrap;
}

/* [2026-08-16] Кнопки плавающей панели переведены на тот же .toolbar-btn, что и верхняя
   панель и панель Documents (были .btn .btn-sm .btn-secondary — рамка + фон у каждой).
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §H. Chat: fish-icons-styles-audit-2026-08-16. */
.floating-toolbar-content .toolbar-btn {
    margin: 0;
    box-sizing: border-box;
    flex: 0 0 34px;
    min-width: 34px;
    width: 34px;
    height: 34px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    border: 1px solid transparent;
    background: transparent;
    border-radius: var(--radius-lg);
    color: var(--text-primary);
    cursor: pointer;
    transition:
        background-color var(--transition-fast),
        color var(--transition-fast);
}

.floating-toolbar-content .toolbar-btn:hover:not(:disabled) {
    background: var(--bg-hover);
}

.floating-toolbar-content .toolbar-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.floating-toolbar-content > :is(.floating-toolbar-drag, .floating-toolbar-close-btn, .toolbar-btn) > svg {
    width: 20px;
    height: 20px;
}

.floating-toolbar-content > :is(.floating-toolbar-drag, .floating-toolbar-close-btn, .toolbar-btn):focus-visible {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

.floating-toolbar-divider {
    width: 2px;
    height: 28px;
    background-color: var(--border-secondary);
    margin: 0 var(--space-2);
    flex-shrink: 0;
    border-radius: 1px;
}

.floating-toolbar-label {
    font-size: var(--font-size-xs);
    color: var(--text-tertiary);
    white-space: nowrap;
    margin: 0;
}

.rotation-input {
    width: 4rem;
    box-sizing: border-box;
    height: var(--inspector-control-height);
    padding: var(--space-1) var(--space-2);
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    font-size: 12.5px;
    text-align: center;
}

.rotation-input:focus,
.width-input-field:focus {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

.rotation-input:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ======================= WIDTH EDITOR PANEL ======================= */

/* [2026-08-16] УДАЛЕНЫ правила `#widthEditorPanel` и `#widthEditorPanel.hidden`: такого
   элемента нет ни в fish.html, ни в JS — js/elements.js его не кэширует, поэтому
   `elements.widthEditorPanel` всегда undefined. Редактор ширины давно живёт секцией
   Properties правой панели (.width-editor-content). CSS был мёртвым.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §D1. Chat: fish-icons-styles-audit-2026-08-16. */

/* [2026-08-16] УДАЛЕНЫ правила плавающей шапки редактора ширины: .width-editor-header,
   .width-editor-drag, .width-editor-title, .width-editor-save-btn, .width-editor-close-btn.
   Ни один из этих классов не встречается в разметке и в JS-генерации — плавающая панель
   заменена секцией Properties правой панели. Обработчики перетаскивания в js/floatingPanel.js
   (317, 387) остались, но их querySelector('.width-editor-header') не находит элемента и
   выходит по guard'у — это отдельный дефект «мёртвый JS», зафиксирован в аудите.
   Оставлены живые: .width-editor-content, .width-editor-controls-row, .width-editor-chart-container.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §D2. Chat: fish-icons-styles-audit-2026-08-16. */

.width-editor-content {
    /* No padding - parent .sidebar-section-body already has padding */
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
}

.width-editor-controls-row {
    display: flex;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.width-editor-controls-row .form-group {
    flex: 1;
    margin-bottom: 0;
}

.width-profile-container {
    display: flex;
    flex-direction: row;
    gap: var(--space-3);
    align-items: flex-start;
}

.width-editor-chart-container {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    max-height: min(400px, 50vh);
    background-color: var(--bg-primary);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-primary);
    padding: var(--space-2);
    display: block;
    flex: 0 1 auto;
    overflow: auto;
    overscroll-behavior: contain;
}

.width-input-field {
    width: 4rem;
    box-sizing: border-box;
    padding: 0 var(--space-1);
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    font-size: 12.5px;
    text-align: center;
    height: var(--inspector-control-height);
}

.width-input-field::-webkit-outer-spin-button,
.width-input-field::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.width-input-field[type='number'] {
    -moz-appearance: textfield;
}

/* ======================= BONE INFO POPOVER ======================= */

.bone-popover {
    position: fixed;
    z-index: 1000;
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    padding: var(--space-3);
    min-width: 150px;
    pointer-events: auto;
}

.bone-popover.hidden {
    display: none;
}

.bone-popover-content {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.bone-popover-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.bone-popover-title {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    color: var(--text-primary);
}

.bone-popover-close,
.bone-popover-edit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    color: var(--text-secondary);
    cursor: pointer;
    border-radius: var(--radius-lg);
    transition:
        background-color var(--transition-base),
        color var(--transition-base);
}

.bone-popover-close:hover,
.bone-popover-edit:hover {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

.bone-popover-close > svg,
.bone-popover-edit > svg {
    width: 20px;
    height: 20px;
}

.bone-popover-close:focus-visible,
.bone-popover-edit:focus-visible {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

.bone-popover-edit.active {
    background-color: var(--brand-primary);
    color: var(--text-inverse);
}

.bone-popover-edit.active:hover {
    background-color: var(--brand-primary-hover);
}

/* ======================= CENTER VIEW BUTTON (CIRCULAR IN FOOTER) ======================= */

/* Canvas Navigation Controls Container */
.canvas-navigation-controls {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

/* Canvas Control Button (Grid, Center View, etc.) */
.canvas-control-btn {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 50%;
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    /* [2026-09-18] Перечень вместо `all` (аудит Д1). СОЗНАТЕЛЬНО НЕ ВКЛЮЧЕНЫ `min-width` и
       `padding`: их меняют состояния кнопки, и с `all` панель управления пересчитывалась каждый
       кадр. Ref: docs/AUDIT_UI_MOTION_2026-09-17.md Д1. Chat: ui-motion-fixes-2026-09-17. */
    transition:
        background-color var(--transition-base),
        border-color var(--transition-base),
        color var(--transition-base),
        box-shadow var(--transition-base),
        transform var(--transition-base);
    flex-shrink: 0;
    box-shadow: var(--shadow-sm);
}

.canvas-control-btn:hover {
    background-color: var(--bg-hover);
    transform: scale(1.05);
    box-shadow: var(--shadow-md);
}

.canvas-control-btn:active {
    transform: scale(0.98);
    box-shadow: var(--shadow-sm);
}

.canvas-control-btn.active {
    background-color: var(--brand-primary);
    color: var(--text-inverse);
}

.canvas-control-btn.active:hover {
    background-color: var(--brand-primary-hover);
}

/* [2026-08-16] Размер значка кнопки холста задаётся ЗДЕСЬ, а не только атрибутом svg:
   он зависит от ширины окна (медиа-запросы ниже уменьшают его до 22 и 20). Атрибут даёт
   базовые 24, CSS перекрывает их на узких экранах — поведение адаптива сохранено 1-в-1.
   Ref: docs/DEV_GUIDE_FISH_TO_WORD_CONTRACT_2026-08-16.md §3 шаг 5.
   Chat: fish-icons-styles-audit-2026-08-16. */
.canvas-control-btn svg {
    width: 24px;
    height: 24px;
}

/* [2026-08-16] УДАЛЁН legacy-дубль .center-view-btn (полная копия .canvas-control-btn).
   В разметке обе кнопки холста — #toggleGridBtn и #centerViewBtn — несут класс
   .canvas-control-btn, класса .center-view-btn нет ни в HTML, ни в JS.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §D3. Chat: fish-icons-styles-audit-2026-08-16. */

/* Context Menu Styles */
/* [2026-08-16] `display: none`, `position: absolute` и уровень наложения перенесены сюда из
   inline-`style` разметки. z-index был 10000 — ВЫШЕ системного --z-tooltip (1070), из-за чего
   меню перекрывало тултипы; поставлен --z-dropdown (1025), это тот же смысловой уровень, что
   у выпадающих меню, и он ниже модалок и тултипов.
   ВАЖНО: скрытие оставлено ИМЕННО правилом `display: none` без `!important` и БЕЗ общего
   класса `.hidden` — js/events.js:313,329,338 показывает и прячет меню присваиванием
   `menu.style.display`, а `.hidden` из styles/styles.css:518 объявлен с `!important` и
   заблокировал бы показ меню навсегда.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §F1, §E8. Chat: fish-icons-styles-audit-2026-08-16. */
.context-menu {
    display: none;
    position: absolute;
    z-index: var(--z-dropdown);
    background-color: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    padding: var(--space-1) 0;
    min-width: 150px;
}

.context-menu-item {
    padding: var(--space-2) var(--space-4);
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: background-color var(--transition-fast);
    color: var(--text-primary);
}

.context-menu-item:hover {
    background-color: var(--bg-hover);
}

/* [2026-08-16] Значок пункта меню — контурный SVG набора модуля; размер задан атрибутом svg.
   СОБСТВЕННЫЙ ЦВЕТ ЗНАЧКА СНЯТ: при `stroke="currentColor"` правило `color: var(--text-secondary)`
   перекрашивало значок и делало его бледнее подписи — ровно та ошибка, на которой поймали
   модуль таблиц. Цвет живёт на пункте меню, значок наследует.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §E8;
        docs/DEV_GUIDE_FISH_TO_WORD_CONTRACT_2026-08-16.md §3 шаг 3, §4 (ловушка 2).
   Chat: fish-icons-styles-audit-2026-08-16. */
.context-menu-item svg {
    margin-right: var(--space-2);
}

/* Drawing hints on canvas - use CSS variables for SVG elements */
.drawing-hint-text {
    fill: var(--text-primary);
    user-select: none;
    pointer-events: none;
}

.rubber-band-line {
    stroke: var(--text-tertiary);
    pointer-events: none;
}

.first-click-marker {
    fill: var(--color-error);
    stroke: var(--bg-primary);
    stroke-width: 2px;
    opacity: 0.7;
    pointer-events: none;
}

/* Asymmetry editor graph elements */
.asymmetry-grid-line {
    stroke: var(--border-primary);
}

.asymmetry-grid-text {
    fill: var(--text-tertiary);
}

.asymmetry-curve-path {
    stroke: var(--color-warning);
    fill: none;
}

.asymmetry-circle {
    fill: var(--color-warning);
    stroke: var(--bg-secondary);
}

.asymmetry-center-line {
    stroke: var(--border-secondary);
}

/* Mixed value fields (for multiselect with different values) */
/* [2026-08-16] Хардкод #ef4444 заменён на семантические токены: цвет ошибки обязан
   меняться вместе с темой (в тёмной теме --color-error = #f87171).
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §C2. Chat: fish-icons-styles-audit-2026-08-16. */
.mixed-value {
    border-color: var(--color-error) !important;
    background-color: rgba(var(--color-error-rgb), 0.05) !important;
}

.mixed-value::placeholder {
    color: var(--color-error-text);
    opacity: 0.7;
}

/* ======================= RIGHT SIDEBAR PANEL ======================= */

/* Main container for sidebar management */
.fish-main-container {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* The communication dock reserves space on the body child. Slides positions
   its work panel against that child's edge, so shrink the child itself rather
   than only its padding; otherwise the panel sits underneath the dock. */
html.has-universal-sidebar body.slides-page > #fish-main-container {
    width: calc(100% - var(--usb-reserve-w));
    padding-right: 0 !important;
}

/* Right sidebar panel */
/* [2026-08-16] Фон панели приведён к канону Word. Замер обеих страниц (1500×950) по
   вопросу PO «правая панель соответствует другим панелям Word и PDF по дизайну и стилям?»:
   у `.editor-sidebar` (modules/documents/css/sidebar.css:6) тело БЕЛОЕ (--bg-primary), а серый
   только заголовок секции; у Fish было наоборот — тело серое (--bg-secondary), а заголовок
   ещё темнее (--bg-tertiary). Слои были перепутаны, из-за чего панель читалась «тяжелее»
   словной. Ref: docs/QA_FISH_RIGHT_PANEL_2026-08-16.md. Chat: fish-icons-styles-audit-2026-08-16. */
.right-sidebar {
    position: absolute;
    top: 0;
    right: 0;
    width: var(--ek-right-panel-width, 340px);
    background-color: var(--bg-primary);
    border-left: 1px solid var(--border-primary);
    z-index: 50;
    display: flex;
    flex-direction: column;
    overflow: hidden; /* No scroll on sidebar itself - sections handle their own scrolling */
    transition:
        transform 300ms cubic-bezier(0.4, 0, 0.2, 1),
        opacity 300ms cubic-bezier(0.4, 0, 0.2, 1);
    /* Height set dynamically by JS to match canvas height */
}

/* [2026-10-23] Высоты не хватает на заголовки и нижний предел тела раздела (`rightSidebar.js`, MIN_SECTION_BODY) —
   прокручивается сама панель; тела разделов по-прежнему прокручиваются внутри себя.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md, этап 1. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.right-sidebar.is-crowded {
    overflow-y: auto;
}

/* Collapsed state */
.fish-main-container.right-sidebar-collapsed .right-sidebar {
    transform: translateX(100%);
    opacity: 0;
    pointer-events: none;
}

/* Sidebar section */
.sidebar-section {
    border-bottom: 1px solid var(--border-primary);
    flex-shrink: 0;
}

.sidebar-section:last-child {
    border-bottom: none;
}

/* Sidebar section header (button) */
/* [2026-08-16] Фон заголовка — `--bg-secondary`, как у `.sidebar-panel-header` Word
   (sidebar.css:46). Было `--bg-tertiary` — на тон темнее канона.
   Ref: docs/QA_FISH_RIGHT_PANEL_2026-08-16.md. Chat: fish-icons-styles-audit-2026-08-16. */
.sidebar-section-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: none;
    cursor: pointer;
    transition: background-color var(--transition-base);
}

.sidebar-section-header:hover {
    background-color: var(--bg-hover);
}

/* [2026-08-16] Заголовок секции — типографика панели Word. Замер обеих страниц по замечанию
   PO «не выглядит как модуль Word»: у Fish заголовок был 16 px обычным регистром цветом
   --text-primary, а `.sidebar-panel-header` в modules/documents/css/sidebar.css:36-48 —
   12 px, ПРОПИСНЫМИ, с разрядкой 0.5px и цветом --text-secondary. Отступы (12px 16px) и фон
   у Fish уже совпадали, расходилась именно надпись.
   Ref: docs/QA_FISH_TO_WORD_ICONS_2026-08-16.md §6. Chat: fish-icons-styles-audit-2026-08-16. */
.sidebar-section-title {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-secondary);
}

/* Строка заголовка: переключатель секции + иконочное действие справа (канон «Pages» в Word). */
.sidebar-section-headline {
    display: flex;
    align-items: center;
    background-color: var(--bg-secondary);
}

.sidebar-section-headline .sidebar-section-header {
    flex: 1;
    min-width: 0;
    background-color: transparent;
}

/* [2026-10-02] СТРЕЛКА СВОРАЧИВАНИЯ — ВСЕГДА В ОДНОЙ КОЛОНКЕ У ПРАВОГО КРАЯ. Действие раздела
   («+» у Layers, «i» у Bill of materials) стояло ПРАВЕЕ стрелки, и стрелки разделов с действием
   уезжали влево — зигзаг по колонке (снимок и замечание PO: «кнопка сворачивания всегда справа,
   она статична, а остальные кнопки слева от неё»). Заголовок-переключатель занимает всю строку,
   как у разделов без действий, поэтому стрелка стоит ровно там же; действие ложится поверх
   строки слева от стрелки, а заголовок резервирует под него место справа.
   Ref: docs/TZ_FISH_3D_MINECRAFT_UX_2026-09-18.md §12.18.
   Chat: fish-model-composition-sidebar-section-2026-10-02. */
.sidebar-section-headline {
    position: relative;
    --sidebar-header-action-size: 34px;
}
/* Место под действие резервирует ПОДПИСЬ, а не кнопка-заголовок: отступ на кнопке сдвигал
   стрелку влево (замер в окне: 1442 px против 1502 px у разделов без действия). */
.sidebar-section-headline .sidebar-section-title {
    min-width: 0;
    margin-inline-end: calc(var(--sidebar-header-action-size) + var(--space-2) * 2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sidebar-section-headline .fish-sidebar-btn {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-end: calc(var(--space-4) + 20px + var(--space-2));
    margin: 0;
    transform: translateY(-50%);
}

/* Иконочные действия в заголовках Layers/Properties: 34×34, радиус 8, SVG20. */
.fish-sidebar-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    margin-right: var(--space-3);
    box-sizing: border-box;
    border: 1px solid transparent;
    background: transparent;
    border-radius: var(--radius-lg);
    cursor: pointer;
    color: var(--text-secondary);
    transition:
        background-color var(--transition-fast),
        color var(--transition-fast);
}

.fish-sidebar-btn:hover:not(:disabled) {
    background: var(--bg-hover);
    color: var(--text-primary);
}

.fish-sidebar-btn:focus-visible {
    border-color: var(--border-hover);
    outline: none;
    box-shadow: none;
}

/* [2026-10-02] «i» Properties — уведомление о недостающем у выбранного элемента: цвет
   предупреждения; без недостающего кнопки нет. Правила стоят ПОСЛЕ канона `.fish-sidebar-btn`,
   иначе его display:flex и цвет вторичного текста перебивали их.
   Ref: docs/TZ_FISH_3D_MINECRAFT_UX_2026-09-18.md §35. Chat: fish-model-composition-sidebar-section-2026-10-02. */
.fish-sidebar-btn[hidden] {
    display: none;
}
.fish-sidebar-btn.fish-sidebar-notice,
.fish-sidebar-btn.fish-sidebar-notice:hover:not(:disabled) {
    color: var(--color-warning-text);
}

.fish-sidebar-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.sidebar-section-icon {
    width: 20px;
    height: 20px;
    color: var(--text-secondary);
    transition: transform var(--transition-base);
}

/* Rotate icon when section is open */
.sidebar-section.active .sidebar-section-icon {
    transform: rotate(180deg);
}

/* Sidebar section content */
.sidebar-section-content {
    max-height: 0;
    overflow: hidden;
}

.sidebar-section.active .sidebar-section-content {
    max-height: var(--sidebar-content-max-height, 2000px);
    height: var(--sidebar-content-max-height, 2000px);
    display: flex;
    flex-direction: column;
}

/* [2026-08-16] Отступ тела — `--space-2` (8px), как `.sidebar-panel-content` Word
   (sidebar.css:71). Было 16px: содержимое панели стояло вдвое дальше от краёв, чем в
   эталоне. Ref: docs/QA_FISH_RIGHT_PANEL_2026-08-16.md. Chat: fish-icons-styles-audit-2026-08-16. */
.sidebar-section-body {
    padding: var(--space-2);
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    min-height: 0;
}

/* Custom scrollbar for section bodies */
.sidebar-section-body.custom-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: var(--border-secondary) transparent;
}

.sidebar-section-body.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}

.sidebar-section-body.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar-section-body.custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: var(--border-secondary);
    border-radius: 3px;
}

.sidebar-section-body.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: var(--border-primary);
}

/* ======================= MOBILE RESPONSIVE STYLES ======================= */

/* Media query for mobile devices (screens < 768px) */
@media (max-width: 767px) {
    /* [2026-08-16] Мобильное правило #widthEditorPanel удалено вместе с базовым: элемента
       не существует. Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §D1.
       Chat: fish-icons-styles-audit-2026-08-16. */

    /* Floating Toolbar - make responsive on mobile */
    #floatingToolbar {
        max-width: calc(100vw - 32px);
        left: 16px !important;
        right: auto;
    }

    /* Floating toolbar content - allow wrapping on very small screens */
    .floating-toolbar-content {
        flex-wrap: wrap;
        max-width: calc(100vw - 64px);
    }

    /* Modal container - reduce max-width on mobile */
    .modal-container-lg {
        max-width: calc(100vw - 32px);
        margin: 16px;
    }

    /* [2026-08-16] На узком экране действия строки видны всегда: наведения на сенсорном
       экране нет, и скрытые по hover кнопки были бы недоступны — тот же приём, что в
       браузере документов. Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §K.
       Chat: fish-icons-styles-audit-2026-08-16. */
    .diagram-item-actions {
        opacity: 1;
    }

    /* Width profile container - stack vertically on mobile */
    .width-profile-container {
        flex-direction: column;
    }

    /* Canvas control buttons - slightly smaller on mobile */
    /* [2026-08-16] Из списка селекторов убран мёртвый .center-view-btn.
       Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §D3. Chat: fish-icons-styles-audit-2026-08-16. */
    .canvas-control-btn {
        width: 44px;
        height: 44px;
        min-width: 44px;
    }

    .canvas-control-btn svg {
        width: 22px;
        height: 22px;
    }
}

/* Media query for very small screens (< 480px, like iPhone SE) */
@media (max-width: 479px) {
    /* [2026-08-16] Правило #widthEditorPanel удалено — элемента не существует.
       Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §D1. Chat: fish-icons-styles-audit-2026-08-16. */

    #floatingToolbar {
        max-width: calc(100vw - 16px);
        left: 8px !important;
    }

    .modal-container-lg {
        max-width: calc(100vw - 16px);
        margin: 8px;
    }

    /* Further reduce button sizes for very small screens */
    /* [2026-08-16] Из списка селекторов убран мёртвый .center-view-btn.
       Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §D3. Chat: fish-icons-styles-audit-2026-08-16. */
    .canvas-control-btn {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }

    .canvas-control-btn svg {
        width: 20px;
        height: 20px;
    }
}

/* ============================================
   LAYERS UI STYLES
   ============================================ */

/* Layers list container */
.layers-list {
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* Individual layer item */
.layer-item {
    min-height: 38px;
    background-color: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0 var(--space-2);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    transition: background-color 0.2s ease;
    overflow: hidden; /* Prevent content from overflowing */
}

.layer-item:hover {
    background-color: var(--bg-secondary);
}

/* A selected layer is identified by its whole surface, without an outer ring. */
.layer-item.active {
    background-color: var(--bg-hover);
}

/* Layer name (editable) */
.layer-name {
    flex: 1;
    min-width: 0; /* Allow shrinking */
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-primary);
    background: transparent;
    border: none;
    outline: none;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-md);
    cursor: text;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Inline editing keeps its geometry and the shared quiet field focus. */
.layer-name:focus {
    background-color: var(--bg-primary);
    border: none;
    outline: 1px solid var(--border-hover);
    outline-offset: -1px;
    box-shadow: none;
}

/* System layer (Default Layer) - non-editable */
.layer-name.system {
    cursor: default;
    font-weight: 600;
    color: var(--text-secondary);
}

.layer-name.system:focus {
    background-color: transparent;
    border: none;
}

/* Layer control buttons */
.layer-controls {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-shrink: 0; /* Prevent shrinking */
}

.layer-control-btn {
    width: 34px;
    height: 34px;
    box-sizing: border-box;
    flex: 0 0 34px;
    background: transparent;
    border: 1px solid transparent;
    padding: 0;
    cursor: pointer;
    color: var(--text-tertiary);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

.layer-control-btn:hover {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.layer-control-btn svg {
    width: 20px;
    height: 20px;
}

.layer-control-btn:focus-visible {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

/* Active button state */
/* [2026-08-16] Хардкод #10b981 → токены успеха (тема).
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §C1. Chat: fish-icons-styles-audit-2026-08-16. */
/* [2026-08-16] Зелёный → фирменный: состояние «включено» в панелях Word/PDF показывается
   тонированной фирменной подложкой (`.toolbar-btn.active`), а зелёный в системе значит «успех».
   Ref: docs/QA_FISH_TO_WORD_ICONS_2026-08-16.md §6. Chat: fish-icons-styles-audit-2026-08-16. */
.layer-control-btn.active {
    color: var(--brand-primary-text);
    background-color: rgba(var(--brand-primary-rgb), 0.12);
}

.layer-control-btn.active:hover {
    background-color: rgba(var(--brand-primary-rgb), 0.2);
}

/* Hidden state button */
/* [2026-08-16] КРИТИЧНО: состояние переименовано `hidden` → `is-hidden`. Общий утилитарный
   класс `.hidden` объявлен в styles/styles.css:518 как `display: none !important`, поэтому
   кнопка-глаз скрытого слоя ПРОПАДАЛА с экрана — вернуть слою видимость этой кнопкой было
   нельзя. Правило по цвету перебить `!important` не могло. Имя состояния должно быть своим,
   как `.active`/`.locked` рядом. Регрессия закрыта тестом на ВИДИМОСТЬ по реальному каскаду.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §A5. Chat: fish-icons-styles-audit-2026-08-16. */
.layer-control-btn.is-hidden {
    color: var(--text-disabled);
}

/* Locked state button */
/* [2026-08-16] Токена --warning-primary в проекте НЕТ — состояние «замок» не окрашивалось.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §B3. Chat: fish-icons-styles-audit-2026-08-16. */
.layer-control-btn.locked {
    color: var(--color-warning-text);
}

/* Delete button */
/* [2026-08-16] Токенов --danger-primary/--danger-bg в проекте НЕТ — кнопка удаления слоя
   не была красной и не подсвечивалась на hover.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §B4. Chat: fish-icons-styles-audit-2026-08-16. */
.layer-control-btn.delete {
    color: var(--color-error-text);
}

.layer-control-btn.delete:hover {
    background-color: var(--color-error-bg);
}

/* System layer - hide delete button */
.layer-item.system .layer-control-btn.delete {
    display: none;
}

/* Layer bone count badge */
.layer-bone-count {
    font-size: var(--font-size-xs);
    color: var(--text-tertiary);
    background-color: var(--bg-secondary);
    padding: 2px 6px;
    border-radius: var(--radius-full);
    min-width: 20px;
    text-align: center;
    flex-shrink: 0; /* Prevent shrinking */
}

/* Вкладки и их непрерывный контур стыка с холстом — УНИВЕРСАЛЬНЫЙ компонент:
   styles/module-tabs-row.css + components/module-tabs-boundary.js. Локальных
   стилей вкладок здесь нет (свечение-ореол холста убрано выше — это Fish-специфично). */

/* Управление файлом-диаграммой в верхней панели кнопок (открыть/имя/переименовать/сохранить) */
/* [2026-08-16] Интервал приведён к канону группы панели Documents (`.toolbar-group { gap: 2px }`,
   modules/documents/css/pdf-toolbar.css:26-31) — было 4px, из-за чего файл-контролы стояли
   реже остальных кнопок ряда. Правило `.fish-toolbar-sep` УДАЛЕНО: разделитель в разметке
   заменён каноническим `.toolbar-divider`, класс больше не встречается ни в HTML, ни в JS.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §H. Chat: fish-icons-styles-audit-2026-08-16. */
.fish-diagram-controls {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}
.fish-diagram-controls .fish-doc-name {
    font-weight: 600;
    color: var(--text-primary);
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* [2026-10-03] Подпись фигуры на схеме и поле её правки над средней точкой кости — токены темы.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.2, §3.5.4. Chat: slides-tz-2026-10-02. */
#diagramCanvas .bone-label {
    fill: var(--text-primary);
    font-family: var(--font-family);
    font-size: var(--font-size-sm);
    pointer-events: all;
    cursor: text;
    user-select: none;
}

/* [2026-10-03] На листе файла Slides фигуры и подписи берут цвета и шрифт ТЕМЫ ПРЕЗЕНТАЦИИ
   (переменные ставит renderer.js на группу холста), выделенная фигура — по-прежнему цветом выбора.
   Граница листа — тонкая линия, поле вне листа — фоном холста.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Лист на холсте»). Chat: slides-tz-2026-10-02. */
#diagramCanvas .slides-sheet {
    stroke: var(--border-primary);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
}

.slides-has-pages #diagramCanvas .bone-path {
    fill: var(--slides-accent, var(--color-info));
}

.slides-has-pages #diagramCanvas .bone-path.selected {
    fill: var(--color-error);
}

/* [2026-10-04] Символ-линия библиотеки (труба, кабель, воздуховод, лоток) — цветом текста листа, как символы-фигуры
   набора; выделенная — цветом выбора. Живая проверка 2026-10-04: труба рисовалась синим пером.
   Ref: docs/TZ_SLIDES_PPTX_COMPAT_2026-10-04.md §4.0 п.4. Chat: slides-tz-2026-10-02. */
.slides-has-pages #diagramCanvas .bone-path.line-symbol {
    fill: var(--slides-ink, var(--text-primary));
}

.slides-has-pages #diagramCanvas .bone-path.line-symbol.selected {
    fill: var(--color-error);
}

.slides-has-pages #diagramCanvas .bone-label {
    fill: var(--slides-ink, var(--text-primary));
    font-family: var(--slides-font, var(--font-family));
}

/* [2026-10-03] Значок типа на листе — цветом текста темы презентации, как в эскизах и выпуске (pageSvg.js);
   прежде он брал цвет текста интерфейса, и на светлом листе тёмной темы окна был почти белым.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Лист на холсте»). Chat: slides-tz-2026-10-02. */
.slides-has-pages #diagramCanvas .bone-type-mark {
    color: var(--slides-ink, var(--text-primary));
}

/* [2026-10-03] Мастер-лист: фигуры мастера лежат под фигурами страницы и не ловят указатель (их правят в
   «Правке мастера»). В самой правке мастера граница листа — пунктир цвета выбора: режим виден на холсте.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Оформление и мастер»). Chat: slides-tz-2026-10-02. */
#diagramCanvas .slides-master-layer {
    pointer-events: none;
}

/* [2026-10-04] Фигуры-символы: щелчок по контуру выделяет фигуру; выделенная — контур цвета выбора; концы
   соединений — точки, к которым привязывают концы линий. Ref: docs/AUDIT_SLIDES_BONE_AS_ENTITY_2026-10-04.md S9,
   S21; docs/TZ_SLIDES_PPTX_COMPAT_2026-10-04.md §4.0. Chat: slides-tz-2026-10-02. */
#diagramCanvas .slides-figure-layer [data-figure-id] {
    cursor: move;
}

#diagramCanvas .slides-figure-layer g.is-selected path {
    stroke: var(--color-info);
}

#diagramCanvas .slides-figure-layer .figure-port {
    fill: var(--bg-primary);
    stroke: var(--color-info);
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
}

body.fish-readonly #diagramCanvas .slides-figure-layer [data-figure-id] {
    cursor: default;
}

#diagramCanvas .slides-sheet.is-master {
    stroke: var(--color-info);
    stroke-width: 2;
    stroke-dasharray: 8 6;
}

.slides-master-bar {
    position: absolute;
    top: var(--space-3);
    left: 50%;
    transform: translateX(-50%);
    z-index: 6;
    display: flex;
    align-items: center;
    gap: var(--space-3);
    max-width: calc(100% - 2 * var(--space-4));
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--color-info);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    color: var(--text-primary);
    font-size: var(--font-size-sm);
}

.slides-master-hint {
    color: var(--text-secondary);
}

/* [2026-10-03] Раздел «Оформление»: строки «подпись — образец цвета», без боксов (DESIGN.md «Лэйаут»).
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4. Chat: slides-tz-2026-10-02. */
.slides-design {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.slides-design-heading {
    margin-top: var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.slides-design-heading:first-child {
    margin-top: 0;
}

/* [2026-10-29] Галереи оформления (E5.6–E5.10, п.3): список строк с образцом и именем, строка кликабельна целиком;
   длинный список прокручивается внутри. Текущее оформление — отмеченная строка. Ref:
   docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E5» E5.6–E5.10, п.3.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-design-galleries {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.slides-gallery {
    display: flex;
    flex-direction: column;
    max-height: 220px;
    min-height: 0;
    overflow-y: auto;
}

.slides-gallery-row {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    cursor: pointer;
}

.slides-gallery-row:hover,
.slides-gallery-row:focus-visible {
    background: var(--bg-hover);
    outline: none;
}

.slides-gallery-row.is-current {
    background: var(--bg-hover);
    font-weight: var(--font-weight-semibold);
}

.slides-gallery-row[aria-disabled='true'] {
    cursor: not-allowed;
    opacity: 0.6;
}

.slides-gallery-sample {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 2px;
    width: 64px;
    height: 28px;
    /* [2026-10-29] Отступ по шкале (`--space-1`, 4px), канон UI SPACING_OFF_SCALE. Chat: slides-deckcraft-parity-part2-2026-10-18. */
    padding: var(--space-1);
    box-sizing: border-box;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-sm);
}

.slides-gallery-swatch {
    flex: 1 1 0;
    height: 100%;
    border-radius: 1px;
}

.slides-gallery-swatch--wide {
    border: 1px solid var(--border-primary);
}

.slides-gallery-font {
    font-size: 16px;
    line-height: 1;
}

.slides-gallery-shape {
    width: 32px;
    height: 16px;
    box-sizing: border-box;
    border-radius: 2px;
}

.slides-gallery-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slides-slide-size {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.slides-slide-size-units {
    margin: 0;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

/* [2026-10-04] Рамка выделения принятого элемента PowerPoint — цветом выбора, не масштабируется с холстом.
   Ref: docs/TZ_SLIDES_PPTX_COMPAT_2026-10-04.md §4.3. Chat: slides-tz-2026-10-02. */
#diagramCanvas .slides-element-selection {
    fill: none;
    stroke: var(--color-info);
    stroke-width: 1.5;
    stroke-dasharray: 4 3;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
}

/* [2026-10-04] «Свойства» фигуры-символа: строки «название — значение» только для чтения, подсказка о составе.
   Ref: docs/AUDIT_SLIDES_BONE_AS_ENTITY_2026-10-04.md S10. Chat: slides-tz-2026-10-02. */
.slides-figure-properties {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding-bottom: var(--space-3);
}

.slides-figure-properties[hidden] {
    display: none;
}

.slides-figure-prop {
    display: flex;
    justify-content: space-between;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
}

.slides-figure-prop-name {
    color: var(--text-secondary);
}

.slides-figure-prop-value {
    color: var(--text-primary);
    text-align: right;
    overflow-wrap: anywhere;
}

/* У выделенной фигуры из полей кости остаётся только слой (первая группа): профиль, ширина, прямая линия, шаблон
   и «Сохранить изменения» к фигуре не относятся. Ref: аудит кости-сущности S10. */
body.slides-figure-selection #profile2dProperties > :not(:first-child),
body.slides-figure-selection #applyWidthBtn {
    display: none !important;
}

/* [2026-10-17] У выделенного элемента (надпись, фигура, рисунок PowerPoint) поля кости не показываются вовсе — у него
   свои «Заливка и контур» (D3.5; живая проверка: под ними стояли слой, ширина и «Сохранить как шаблон» кости).
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D3.5. Chat: slides-deckcraft-parity-2026-10-17. */
body.slides-element-selection #profile2dProperties,
body.slides-element-selection #applyWidthBtn {
    display: none !important;
}

.slides-figure-props-hint {
    margin: 0;
    font-size: var(--font-size-xs);
    color: var(--text-tertiary);
}

/* [2026-10-04] Исход смены стандарта символов фрейма — строкой под выбором (не новым окном); пустая строка места
   не занимает. Ref: docs/TZ_SLIDES_PPTX_COMPAT_2026-10-04.md §10 п.8. Chat: slides-tz-2026-10-02. */
.slides-symbol-set-status {
    margin: var(--space-1) 0 0;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.slides-symbol-set-status:empty {
    display: none;
}

/* [2026-10-31] Действующий стандарт символов — показ без выбора и ссылка на системный документ-источник.
   Ref: docs/TZ_SYMBOL_STANDARD_REGULATORY_BLOCK_2026-10-31.md §3 п.6. Chat: HP Slides (slides-visio-parity-2026-10-30). */
.slides-symbol-set-value {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
}

.slides-symbol-set-source {
    display: inline-block;
    margin-top: var(--space-1);
    font-size: var(--font-size-xs);
    color: var(--brand-primary);
    text-decoration: none;
}

.slides-symbol-set-source:hover {
    text-decoration: underline;
}

.slides-symbol-set-source[hidden] {
    display: none;
}

.slides-design-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    min-height: 38px;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    cursor: pointer;
}

.slides-design-color {
    width: 40px;
    height: 38px;
    box-sizing: border-box;
    padding: 2px;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    cursor: pointer;
}

.slides-design-color:focus,
.slides-design-color:focus-visible {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

.slides-design-color:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

#slidesElementProperties .slides-design-color {
    height: var(--inspector-control-height);
}

#slidesElementProperties .slides-figure-prop {
    align-items: center;
    min-width: 0;
}

#slidesElementProperties .slides-figure-prop-name {
    min-width: 0;
    overflow-wrap: anywhere;
}

.slides-element-prop-controls {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: var(--space-2);
    min-width: 0;
    max-width: 100%;
}

.slides-element-prop-check {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    min-height: var(--inspector-control-height);
    min-width: 0;
    max-width: 100%;
}

.slides-master-count {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.slides-master-edit[hidden] {
    display: none;
}

/* [2026-10-03] Состояния окна на холсте: загрузка (индикатор), подсказка пустой страницы, строка
   «файл изменён в другом окне». Без окон сообщений. Библиотека фигур в «Только просмотр» приглушена.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Состояния окна»), §4.1. Chat: slides-tz-2026-10-02. */
.slides-loading {
    position: absolute;
    inset: 0;
    z-index: 7;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    background-color: var(--bg-primary);
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
}

.slides-loading-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid var(--border-primary);
    border-top-color: var(--color-info);
    border-radius: 50%;
    animation: slides-spin var(--spinner-duration) linear infinite;
}

@keyframes slides-spin {
    to {
        transform: rotate(360deg);
    }
}

.slides-empty-hint {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 4;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
    pointer-events: none;
    /* [2026-10-23] Подсказка не заходит под правую панель: панель лежит поверх холста (`.right-sidebar` —
       absolute, ширина `--ek-right-panel-width`), и центр по всему холсту уводил конец фразы под неё (живая
       проверка E1). При открытой панели — центр и предел ширины по видимой части, длинная фраза переносится.
       Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md, этап 1. Chat: slides-deckcraft-parity-part2-2026-10-18. */
    max-width: calc(100% - 2 * var(--space-4));
    text-align: center;
}

.fish-main-container:not(.right-sidebar-collapsed) .slides-empty-hint {
    left: calc((100% - var(--ek-right-panel-width, 340px)) / 2);
    max-width: calc(100% - var(--ek-right-panel-width, 340px) - 2 * var(--space-4));
}

/* [2026-10-04] Строки состояния файла (устаревшая ревизия, несохранённый черновик) стоят колонкой над листом:
   место задаёт колонка, а не каждая строка, — две строки не ложатся друг на друга.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.4 п.9, §3.5.4. Chat: slides-tz-2026-10-02. */
.slides-canvas-lines {
    position: absolute;
    top: var(--space-3);
    left: 50%;
    transform: translateX(-50%);
    z-index: 6;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    max-width: calc(100% - 2 * var(--space-4));
}

.slides-stale-line,
.slides-draft-line {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    max-width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--color-error);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    color: var(--text-primary);
    font-size: var(--font-size-sm);
}

/* [2026-10-04] Черновик — не ошибка: рамка цветом действия. Ref: ТЗ Slides §3.4 п.9. Chat: slides-tz-2026-10-02. */
.slides-draft-line {
    border-color: var(--brand-primary);
}

/* [2026-10-25] Совместная правка: «в базе новая версия» (сведение, рамка действия) и конфликт слияния (рамка ошибки,
   строка на конфликт с «Моё / Их»). Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md, «Уточнение E2» п.2–3.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-remote-line,
.slides-conflict-line {
    max-width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--brand-primary);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    color: var(--text-primary);
    font-size: var(--font-size-sm);
}

/* [2026-10-29] Автосохранение не прошло («Не сохранено: нет связи», E4.7) — строка колонки, рамка ошибки.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E4» E4.7.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-autosave-line {
    border-color: var(--color-error);
}

/* [2026-10-29] Подсказка броска файла на холст (E4.12): рамка поверх холста, пока над ним несут файл; щелчки и
   бросок проходят к холсту. Строка «Параметров» с ошибкой — цветом ошибки (E4.5).
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E4» E4.5, E4.12.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-drop-hint {
    position: absolute;
    inset: var(--space-2);
    z-index: 7;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px dashed var(--brand-primary);
    border-radius: var(--radius-md);
    background-color: var(--brand-primary-bg);
    color: var(--text-primary);
    font-size: var(--font-size-sm);
    pointer-events: none;
}

.slides-drop-hint[hidden] {
    display: none;
}

.slides-settings-status.is-error {
    color: var(--color-error-text);
}

.slides-conflict-line {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    border-color: var(--color-error);
    max-height: 40vh;
    overflow-y: auto;
}

.slides-conflict-title {
    font-weight: 600;
}

.slides-conflict-row {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.slides-conflict-row > span {
    flex: 1 1 auto;
    min-width: 0;
}

/* [2026-10-03] Выпуск: меню под кнопкой (строки форматов, выбор страниц), строка итога на холсте, пилюля
   версии выпуска в строке пути. Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Выпуск»). Chat: slides-tz-2026-10-02. */
.slides-export-menu {
    top: 100%;
    left: auto;
    right: 0;
    margin-top: var(--space-1);
    min-width: 220px;
    z-index: 1000;
    padding: var(--space-1) 0;
}

/* [2026-10-23] Слева от кнопки нет места (панель в две строки) — меню от левого края кнопки (`exportMenu.js`).
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md, этап 1. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-export-menu.is-left {
    left: 0;
    right: auto;
}

.slides-export-scope {
    display: flex;
    flex-direction: column;
    padding: var(--space-1) var(--space-3) var(--space-2);
    border-bottom: 1px solid var(--border-primary);
}

.slides-export-scope-row {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 28px;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    cursor: pointer;
}

.slides-export-item {
    margin: 0;
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    cursor: pointer;
}

.slides-export-item:hover {
    background-color: var(--bg-secondary);
}

/* [2026-10-03] «JSON графа» есть только у страницы с графом: `.dropdown-item { display: flex }` иначе
   перебивал бы hidden. Слой графа на холсте указатель не ловит (блоки и связи графа пока не правятся мышью).
   Ref: docs/PROPOSAL_SLIDES_GRAPH_AS_BONES_2026-10-03.md §4. Chat: slides-tz-2026-10-02. */
.slides-export-item[hidden] {
    display: none;
}

#diagramCanvas .slides-graph-layer {
    pointer-events: none;
}

/* [2026-10-03] Карточки блоков графа ловят указатель (перенос, Shift — связь, двойной щелчок — заголовок);
   связи и подписи — нет. В «Только просмотр» карточки не тянутся. Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md
   §3.5.3 пп.9–12. Chat: slides-tz-2026-10-02. */
#diagramCanvas .slides-graph-layer [data-node-id] {
    pointer-events: auto;
    cursor: move;
}

body.fish-readonly #diagramCanvas .slides-graph-layer [data-node-id] {
    pointer-events: none;
    cursor: default;
}

#diagramCanvas .slides-graph-link-draft {
    stroke: var(--color-info);
    stroke-width: 2;
    stroke-dasharray: 6 4;
    pointer-events: none;
}

#canvasContainer .slides-node-title-input {
    position: absolute;
    z-index: 6;
    min-width: 160px;
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-sm);
}

/* [2026-10-03] Страница вида «граф» в общем каркасе: инструменты графа в панели, «Виды блоков» на месте
   «Фигур», выделение блоков и связи на холсте, «Свойства» связи и блока, «Текст → граф», вид новой страницы
   у «+ Страница», значок вида страницы в строке. Коробок, теней и своих цветов нет — токены темы.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.1, §3.5.2, §3.5.3 пп.9–12, §3.5.4. Chat: slides-tz-2026-10-02. */
.slides-graph-tools {
    display: flex;
    align-items: center;
    gap: 2px;
}

.slides-graph-tools[hidden] {
    display: none;
}

/* [2026-10-04] Раскладка окна на узком экране (§3.5.5: нет прокрутки страницы при 375 px). Живой замер на
   странице графа: инструменты графа одной строкой (628 px), имя файла (до 240 px) и полное имя файла в
   строке пути (582 px) раздвигали страницу до 644 px. Группы панели переносятся строками, имя файла и
   строка пути сокращаются многоточием; шире окна ничего не встаёт. Правила — только для окна Slides.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.5, §7 («Раскладка окна»). Chat: slides-tz-2026-10-02. */
.slides-graph-tools {
    flex-wrap: wrap;
    max-width: 100%;
}

body.slides-has-pages #breadcrumb-bar .breadcrumb-path {
    min-width: 0;
    flex-wrap: nowrap;
    overflow: hidden;
}

body.slides-has-pages #breadcrumb-bar .bc-segment {
    min-width: 0;
    flex: 0 1 auto;
    overflow: hidden;
    white-space: nowrap;
}

body.slides-has-pages #breadcrumb-bar .bc-value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 479px) {
    .fish-diagram-controls {
        min-width: 0;
        max-width: 100%;
    }

    .fish-diagram-controls .fish-doc-name {
        max-width: 120px;
    }
}

.fish-toolbar .slides-graph-tool.is-active {
    background: rgba(var(--brand-primary-rgb), 0.12);
    color: var(--brand-primary-text);
    box-shadow: none;
}

.slides-graph-zoom {
    min-width: 3.5em;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.fish-toolbar .slides-graph-zoom-reset {
    width: auto;
    padding: 0 var(--space-2);
    font-size: var(--font-size-xs);
}

.slides-graph-counter {
    margin-left: var(--space-2);
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    white-space: nowrap;
}

body.slides-graph-page #fishTypePalette,
body.slides-graph-page .fish-toolbar .slides-schema-tools {
    display: none !important;
}

#diagramCanvas.slides-tool-pan,
#diagramCanvas.slides-tool-pan .slides-graph-layer [data-node-id] {
    cursor: grab;
}

#diagramCanvas.slides-tool-pan.is-panning,
#diagramCanvas.slides-tool-pan.is-panning .slides-graph-layer [data-node-id] {
    cursor: grabbing;
}

#diagramCanvas.slides-tool-connect .slides-graph-layer [data-node-id] {
    cursor: crosshair;
}

/* Выделение — цветом выбора фигуры схемы (`.bone-path.selected` — --color-error) и толще рамкой: синий
   выбор сливался с синей рамкой вида «Идея» (живая проверка 2026-10-03). */
#diagramCanvas .slides-graph-layer [data-node-id].is-selected > rect:first-child {
    stroke: var(--color-error);
    stroke-width: 3;
    stroke-dasharray: none;
}

/* [2026-10-04] Связь графа — ломаная (polyline) в обход карточек. Ref: docs/PROPOSAL_SLIDES_EDGE_ROUTING_2026-10-04.md. */
#diagramCanvas .slides-graph-layer line.is-selected,
#diagramCanvas .slides-graph-layer polyline.is-selected {
    stroke: var(--color-error);
    stroke-width: 3;
}

#diagramCanvas .slides-graph-layer polygon.is-selected {
    fill: var(--color-error);
}

/* [2026-10-14] «Виды блоков» — в разделе «Фигуры» правой панели: фон, линии сверху и справа и растяжение колонки
   (были у левой колонки поверх холста) больше не нужны — раздел даёт свой фон и прокрутку.
   Ref: приказ PO 2026-10-14 «перенеси показ миниатюр и раздел фигур в универсальную правую панель».
   Chat: docstore-stage2-2026-10-11. */
.slides-node-kinds {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.slides-node-kinds[hidden] {
    display: none;
}

.slides-node-kinds-title {
    padding: var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.slides-node-kinds-hint {
    margin: 0 0 var(--space-1);
    padding: 0 var(--space-1);
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.slides-node-kinds-list {
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.slides-node-kind-row {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 28px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    cursor: pointer;
}

.slides-node-kind-row:hover,
.slides-node-kind-row:focus-visible {
    background-color: var(--bg-secondary);
    outline: none;
}

.slides-node-kind-row[aria-disabled='true'] {
    cursor: default;
    color: var(--text-secondary);
}

.slides-node-kind-swatch {
    flex: 0 0 auto;
    width: 12px;
    height: 12px;
    border: 2px solid var(--kind-color);
    border-radius: 3px;
    background: color-mix(in srgb, var(--kind-color) 18%, transparent);
}

.slides-node-kind-swatch.is-dashed {
    border-style: dashed;
}

.slides-node-kind-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slides-node-kind-key {
    flex: 0 0 auto;
    min-width: 18px;
    padding: 0 var(--space-1);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    text-align: center;
}

body.slides-graph-props .width-editor-content {
    display: none;
}

.slides-graph-properties[hidden],
.slides-graph-props-link[hidden],
.slides-graph-props-node[hidden] {
    display: none;
}

.slides-node-text {
    resize: vertical;
    min-height: 72px;
}

.slides-text-graph {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.slides-text-graph-hint {
    margin: 0;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.slides-text-graph-source {
    min-height: 160px;
    resize: vertical;
    font-family: var(--font-family-mono, monospace);
    font-size: var(--font-size-xs);
}

.slides-text-graph-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.slides-page-add-menu {
    display: flex;
    flex-direction: column;
    padding-left: var(--space-4);
}

.slides-page-add-menu[hidden] {
    display: none;
}

.slides-page-line {
    grid-column: 3;
    grid-row: 1;
    display: flex;
    align-items: center;
    gap: var(--space-1);
    min-width: 0;
}

.slides-page-kind {
    display: inline-flex;
    flex: 0 0 auto;
    color: var(--text-secondary);
}

/* [2026-10-17] Скрытый слайд: эскиз и номер приглушены, в строке значок «скрыт» (виден и без наведения).
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D1.2. Chat: slides-deckcraft-parity-2026-10-17. */
.slides-page-row.is-hidden .slides-page-thumb,
.slides-page-row.is-hidden .slides-page-number {
    opacity: 0.45;
}

.slides-page-hidden-mark {
    display: inline-flex;
    flex: 0 0 auto;
    color: var(--text-secondary);
}

.slides-export-result {
    position: absolute;
    /* [2026-10-29] Над строкой состояния и заметками: подъём `--slides-result-lift` ставит exportMenu.showExportResult по
       их рамкам. Ref: docs/QA_SLIDES_DECKCRAFT_PARITY_PART2_E5_2026-10-29.md §5. Chat: slides-deckcraft-parity-part2-2026-10-18. */
    bottom: calc(var(--slides-result-lift, 0px) + var(--space-3));
    left: 50%;
    transform: translateX(-50%);
    z-index: 6;
    max-width: calc(100% - 2 * var(--space-4));
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    color: var(--text-primary);
    font-size: var(--font-size-sm);
}

.slides-export-result.is-error {
    border-color: var(--color-error);
    color: var(--color-error-text);
}

.slides-export-pill {
    display: inline-flex;
    align-items: center;
    margin-left: var(--space-3);
    padding: 0 var(--space-2);
    border-radius: 999px;
    background-color: var(--color-info-light);
    color: var(--color-info-text);
    font-size: var(--font-size-xs);
    line-height: 20px;
    white-space: nowrap;
}

.slides-export-pill.is-stale {
    background-color: var(--color-warning-light, var(--bg-secondary));
    color: var(--color-warning-text, var(--color-error));
}

.fish-type-palette.is-readonly .palette-row {
    cursor: not-allowed;
    opacity: 0.5;
}

/* [2026-10-03] Перетаскивание строки панели «Страницы»: линия места вставки над или под строкой.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Перетаскивание меняет порядок»). Chat: slides-tz-2026-10-02. */
.slides-page-row.is-dragging {
    opacity: 0.5;
}

.slides-page-row.is-drop-before {
    box-shadow: inset 0 2px 0 var(--color-info);
}

.slides-page-row.is-drop-after {
    box-shadow: inset 0 -2px 0 var(--color-info);
}

/* [2026-10-17] Поле правки текста элемента принятой колоды — над рамкой элемента, своего размера (D2.1).
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D2.1. Chat: slides-deckcraft-parity-2026-10-17. */
/* [2026-10-17] Раздел «Вставка» (этап 3): строки в манере библиотеки символов, форма таблицы строкой, статус постановки
   строкой в разделе; при выбранной постановке курсор холста — перекрестие.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md этап 3. Chat: slides-deckcraft-parity-2026-10-17. */
.slides-insert-panel .slides-insert-thumb {
    flex: 0 0 auto;
    color: var(--text-secondary);
}

.slides-insert-panel .slides-insert-row.active {
    color: var(--brand-primary);
    background: var(--bg-secondary);
}

.slides-insert-table-form {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-2);
}

.slides-insert-table-form[hidden] {
    display: none;
}

/* [2026-10-17] Раздел «Переход» (D4.1): строки видов — как у «Вставки», поля — строкой под ними.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D4.1. Chat: slides-deckcraft-parity-2026-10-17. */
.slides-transition-panel .slides-transition-row.active {
    color: var(--brand-primary);
    background: var(--bg-secondary);
}

.slides-transition-options {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: var(--space-2);
    padding: var(--space-2);
}

/* [2026-10-18] Строка раздела колоды в панели «Страницы» (D5.1): имя прописными приглушённо, число слайдов, действия
   при наведении — как у строки страницы. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D5.1.
   Chat: slides-deckcraft-parity-2026-10-17. */
.slides-section-row {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-2) var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-secondary);
}

.slides-section-row .slides-section-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slides-section-row .slides-section-count {
    flex: 0 0 auto;
    font-weight: 400;
}

.slides-section-row .slides-section-name-input {
    flex: 1 1 auto;
    min-width: 0;
    text-transform: none;
}

.slides-section-row:hover .slides-page-actions,
.slides-section-row:focus-within .slides-page-actions {
    visibility: visible;
}

/* [2026-10-18] Комментарии слайда (D5.2): метка на холсте — «облачко» с номером цвета акцента интерфейса (не темы
   презентации), выбранная — темнее; раздел «Комментарии» — строками с нитью ответов и полем ответа у выбранной.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D5.2. Chat: slides-deckcraft-parity-2026-10-17. */
.slides-comment-marker {
    cursor: pointer;
}

.slides-comment-marker path {
    fill: var(--color-warning);
    stroke: var(--text-primary);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

.slides-comment-marker text {
    fill: var(--text-primary);
    pointer-events: none;
}

.slides-comment-marker.is-selected path {
    fill: var(--brand-primary);
}

.slides-comment-marker.is-selected text {
    fill: var(--bg-primary);
}

.slides-comment-list {
    display: flex;
    flex-direction: column;
}

.slides-comment {
    padding: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    cursor: pointer;
}

.slides-comment:hover {
    background: var(--bg-secondary);
}

.slides-comment:focus-visible {
    outline: 1px solid var(--border-hover);
    outline-offset: -1px;
}

.slides-comment.is-selected {
    background: var(--brand-primary-bg);
}

.slides-comment-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.slides-comment-n {
    color: var(--text-secondary);
}

.slides-comment-who {
    min-width: 0;
    max-width: 100%;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.slides-comment-date {
    flex: 1 1 auto;
    min-width: 0;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    overflow-wrap: anywhere;
}

.slides-comment-text {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.slides-comment-reply {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-1) var(--space-2);
    margin: var(--space-1) 0 0 var(--space-3);
}

.slides-comment-reply-form,
.slides-comment-new {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-2) 0 0;
}

.slides-comment-new {
    padding: var(--space-2);
}

@media (min-width: 768px) {
    .slides-comment-new .slides-comment-add,
    .slides-comment-reply-form .slides-comment-reply-send {
        align-self: flex-start;
    }
}

.slides-comment-new[hidden] {
    display: none;
}

.slides-comment .slides-comment-delete {
    visibility: hidden;
}

.slides-comment:hover .slides-comment-delete,
.slides-comment.is-selected .slides-comment-delete {
    visibility: visible;
}

/* [2026-10-23] E1.4: решённое обсуждение — приглушённый текст и метка «Решено»; кнопка решения
   показывается вместе с кнопкой удаления. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md E1.4.
   Chat: slides-deckcraft-parity-2026-10-17. */
.slides-comment.is-resolved .slides-comment-text,
.slides-comment.is-resolved .slides-comment-who {
    color: var(--text-secondary);
}

.slides-comment-state {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.slides-comment .slides-comment-resolve {
    visibility: hidden;
}

.slides-comment:hover .slides-comment-resolve,
.slides-comment.is-selected .slides-comment-resolve,
.slides-comment.is-resolved .slides-comment-resolve {
    visibility: visible;
}

/* [2026-10-18] Затемнение показа (D6.2): чёрный или белый экран поверх слайда и панели.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D6.2. Chat: slides-deckcraft-parity-2026-10-17. */
.slides-show-blank {
    position: absolute;
    inset: 0;
    z-index: 5;
    cursor: pointer;
}

.slides-show-blank[data-blank='black'] {
    /* ui-canon-allow COLOR_LITERAL: Presentation black screen is literal projected content independent of app theme. */
    background: #000000;
}

.slides-show-blank[data-blank='white'] {
    /* ui-canon-allow COLOR_LITERAL: Presentation white screen is literal projected content independent of app theme. */
    background: #ffffff;
}

/* [2026-10-18] Раздел «Колонтитулы» (D5.3): флажки столбцом, поле текста под своим флажком во всю ширину.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D5.3. Chat: slides-deckcraft-parity-2026-10-17. */
.slides-hf-options {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-2);
}

.slides-hf-options .slides-hf-wide .input-field {
    width: 100%;
}

/* [2026-10-29] Раздел «Свойства» колоды (E4.8): поля столбцом во всю ширину, описание — многострочное с ручкой высоты.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E4» E4.8. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-props-options {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-2);
}

.slides-props-options .slides-props-wide .input-field {
    width: 100%;
}

.slides-props-options textarea.input-field {
    resize: vertical;
    min-height: 56px;
}

/* [2026-10-29] Строка «PDF: выдачи» меню выпуска: строка и рядом число слайдов на странице (E4.9).
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E4» E4.9. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-export-row {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.slides-export-row .slides-export-item {
    flex: 1 1 auto;
}

.slides-export-row .slides-export-perpage {
    width: 56px;
    margin-right: var(--space-2);
}

/* [2026-10-18] Раздел «Анимация» (D4.2): порядок эффектов строками (номер, элемент, эффект · начало), принятые —
   приглушённо; действия строкой под списком; поля выбранного — как у «Перехода».
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D4.2. Chat: slides-deckcraft-parity-2026-10-17. */
.slides-anim-list {
    display: flex;
    flex-direction: column;
    max-height: 220px;
    overflow-y: auto;
}

.slides-anim-row {
    display: grid;
    grid-template-columns: 20px 1fr;
    column-gap: var(--space-2);
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    cursor: pointer;
}

.slides-anim-row:hover,
.slides-anim-row:focus-visible {
    background: var(--bg-secondary);
    outline: none;
}

.slides-anim-row.is-selected {
    color: var(--brand-primary);
    background: var(--bg-secondary);
}

.slides-anim-row.is-imported {
    color: var(--text-secondary);
    cursor: default;
}

.slides-anim-n {
    grid-row: span 2;
    color: var(--text-secondary);
}

.slides-anim-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slides-anim-meta {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.slides-anim-note {
    margin: var(--space-1) var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.slides-anim-note[hidden] {
    display: none;
}

.slides-anim-actions,
.slides-anim-options {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: var(--space-2);
    padding: var(--space-2);
}

.slides-animation-panel .slides-anim-dir,
.slides-animation-panel .slides-anim-start {
    max-width: 180px;
}

.slides-insert-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.slides-insert-field .input-field {
    width: 72px;
}

.slides-insert-hint {
    margin: var(--space-1) var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--brand-primary);
}

#canvasContainer.is-inserting #diagramCanvas {
    cursor: crosshair;
}

/* [2026-10-17] Поле правки с полосой оформления (D2.3): обёртка под рамкой элемента, полоса — строкой над полем. */
#canvasContainer .slides-text-editor {
    position: absolute;
    z-index: 6;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    max-width: 100%;
    min-height: 0;
    overflow: auto;
}

#canvasContainer .slides-text-format-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    flex-shrink: 0;
    gap: 2px;
    padding: 2px var(--space-1);
    max-width: 100%;
    box-sizing: border-box;
    background: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    align-self: flex-start;
}

#canvasContainer .slides-text-format-btn {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    box-sizing: border-box;
    padding: 0;
    border: 1px solid transparent;
    border-radius: var(--radius-lg);
    color: var(--text-tertiary);
}

#canvasContainer .slides-text-format-btn > svg {
    width: 20px;
    height: 20px;
}

#canvasContainer .slides-text-format-btn:focus-visible {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

#canvasContainer .slides-text-format-btn[aria-pressed='true'] {
    color: var(--brand-primary);
    background: var(--bg-secondary);
}

#canvasContainer .slides-text-format-size {
    width: 64px;
    height: 34px;
    padding: 0 var(--space-1);
    box-sizing: border-box;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background: var(--bg-primary);
    color: var(--text-primary);
    font-family: inherit;
    font-size: 12px;
}

#canvasContainer .slides-text-format-color {
    width: 34px;
    height: 34px;
    padding: 2px;
    box-sizing: border-box;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background: var(--bg-primary);
}

#canvasContainer :is(.slides-text-format-size, .slides-text-format-color):focus {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

#canvasContainer .slides-element-text-input {
    width: 100%;
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-sm);
    line-height: 1.35;
    color: var(--text-primary);
    background: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    resize: none;
    box-sizing: border-box;
    min-height: 0;
    overflow: auto;
}

#canvasContainer .slides-element-text-input:focus {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

#canvasContainer .bone-label-input {
    position: absolute;
    z-index: 6;
    min-width: 160px;
    transform: translateY(-50%);
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    background: var(--bg-primary);
    border: 1px solid var(--brand-primary);
    border-radius: var(--radius-md);
}

/* [2026-10-03] Поле переименования на месте имени — тот же шрифт и ширина, что у имени, токены темы.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.3 п.2. Chat: slides-tz-2026-10-02. */
.fish-diagram-controls .fish-doc-name-input {
    font-weight: 600;
    width: 240px;
    padding: var(--space-1) var(--space-2);
    color: var(--text-primary);
    background: var(--bg-primary);
    border: 1px solid var(--brand-primary);
    border-radius: var(--radius-md);
}

/* ── Read-only (чужой файл): индикатор + гашение инструментов правки; навигация остаётся ── */
/* [2026-08-16] Плашка приведена к канону: (1) цвета из семантических токенов предупреждения
   вместо литералов rgba(58,58,70,.94)/#ffd479/тени; (2) z-index 4000 → --z-sticky (1020):
   прежнее значение поднимало плашку ВЫШЕ модалок (--z-modal 1050) и тултипов (--z-tooltip 1070),
   что запрещено шкалой DESIGN.md §9.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §C4, §F2. Chat: fish-icons-styles-audit-2026-08-16. */
.fish-readonly-banner {
    position: fixed;
    /* [2026-08-16] Плашка опускается ПОД шапку, а не накрывает её.
       Причина: `header` — sticky с непрозрачным фоном и `z-index: var(--z-fixed)` (1030,
       styles/header.css:30), а плашка после приведения к шкале держит `--z-sticky` (1020).
       При `top: var(--space-2)` индикатор «только чтение» полностью уходил ЗА шапку —
       единственный признак чужого файла становился невидим. Поднимать z-index нельзя
       (DESIGN.md §9), поэтому смещаем по вертикали на фактическую высоту шапки: её
       публикует `setReadOnlyUI()` в js/events.js (шапка тянется при переносе строки,
       фиксированное число здесь было бы враньём). Фолбэк 60px = `min-height` шапки.
       Ref: код-ревью модуля Fish 2026-08-16, находка №2. Chat: spreadsheet-basic-excel-2026-08-15. */
    top: calc(var(--fish-header-h, 60px) + var(--space-2));
    left: 50%;
    transform: translateX(-50%);
    z-index: var(--z-sticky);
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    border-radius: var(--radius-full);
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
    border: 1px solid var(--color-warning);
    font-size: var(--font-size-sm);
    box-shadow: var(--shadow-md);
    pointer-events: none;
}
/* Верхняя панель: отключённые в read-only кнопки правки тусклые. */
/* [2026-08-16] Селекторы переведены с .btn на .toolbar-btn — панель Fish перешла на канон
   панели Documents. Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §H.
   Chat: fish-icons-styles-audit-2026-08-16. */
.fish-readonly .module-controls-row .toolbar-btn:disabled,
.fish-readonly .floating-toolbar-content .toolbar-btn:disabled {
    opacity: 0.4;
}

/* ============================================================================
   [2026-08-16] БЛОК ПРИВЕДЕНИЯ К КАНОНУ: классы, которые разметка и JS модуля уже
   использовали, но правил для них не существовало ни в одном подключённом CSS,
   плюс перенос оформления из inline-`style` и из `element.style.*` в таблицу стилей.
   Причина: аудит иконок и стилей Fish в сравнении с модулями PDF/Word.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §E1-§E9.
   Chat: fish-icons-styles-audit-2026-08-16.
   ============================================================================ */

/* §E3. Строка «чекбокс + подпись» в Properties. Класс использовался разметкой,
   правила не было нигде в проекте — подпись прилипала к чекбоксу без отступа. */
.checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    color: var(--text-primary);
    font-size: var(--font-size-sm);
    cursor: pointer;
    user-select: none;
}

/* §E4. Вкладки окна «Открыть диаграмму». Раньше: ~20 строк inline-`style` в разметке
   плюс 12 присваиваний `element.style.*` в diagramsModal.js для состояния .active. */
.diagrams-modal-tabs {
    display: flex;
    border-bottom: 2px solid var(--border-primary);
    margin-bottom: var(--space-4);
}

.diagrams-modal-tab {
    flex: 1;
    padding: var(--space-3);
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: var(--text-secondary);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    transition:
        color var(--transition-base),
        border-color var(--transition-base);
}

.diagrams-modal-tab:hover {
    color: var(--text-primary);
}

.diagrams-modal-tab.active {
    border-bottom-color: var(--brand-primary);
    color: var(--text-primary);
    font-weight: var(--font-weight-semibold);
}

/* §E5. Строка с кнопкой «Новая диаграмма» в списке диаграмм. */
.diagrams-create-row {
    display: flex;
    justify-content: flex-end;
    margin-bottom: var(--space-3);
}

/* §E1. Индикатор загрузки списка. Раньше нёс Tailwind-классы `text-gray-400 py-8`,
   которых в проекте нет, — текст оставался без оформления. */
.diagrams-loading {
    color: var(--text-secondary);
    text-align: center;
    padding: var(--space-8) 0;
}

/* §E6. Пустое состояние холста: раньше собиралось восемью `element.style.*` в tabs.js.
   Оформление самого блока берут общие .empty-state / .empty-state-icon / .empty-state-text
   (объявлены выше в этом же файле) — здесь только позиционирование по центру холста. */
.fish-canvas-empty {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: var(--text-secondary);
    font-size: var(--font-size-lg);
}

.fish-canvas-empty .empty-state-icon {
    opacity: 0.5;
}

/* §E9. Кнопка «Открыть диаграмму» в панели файла: раньше 11 присваиваний
   `openBtn.style.*` и hover двумя JS-слушателями вместо :hover. */
/* [2026-08-16] УДАЛЕНЫ правила `.fish-open-diagram-btn`: кнопка «Открыть» перешла в общую
   файловую группу панели (`.toolbar-btn.fish-file-btn`) — она единственная была 32 px против
   36 у соседей. Мёртвые правила не оставляем.
   Ref: docs/QA_FISH_OPEN_DIALOG_2026-08-16.md. Chat: fish-icons-styles-audit-2026-08-16. */

/* Кнопка сохранения файла-диаграммы: «есть несохранённые правки» — состоянием-классом,
   а не присваиванием `saveBtn.style.opacity` из двух разных модулей (tabs.js, saveDiagram.js). */
.module-tab-edit.is-pristine {
    opacity: 0.5;
}

/* §F3/§F4 — пояснение к уровням наложения внутри модуля.
   Значения 5 / 50 / 60 (хотбар, плавающая панель, правая панель, её кнопка) и 1000
   (поповер кости, выпадающее меню шаблонов) намеренно ОСТАВЛЕНЫ вне шкалы --z-*:
   это внутренние слои рабочей области, и все они лежат НИЖЕ системных уровней
   (--z-modal-backdrop 1040, --z-modal 1050, --z-tooltip 1070). Подъём их до токенов
   шкалы поставил бы холст поверх выпадающих меню и модалок. Нарушения шкалы, которые
   реально перекрывали системные слои (10000 у контекстного меню, 4000 у плашки
   read-only), исправлены — см. §F1, §F2. */

/* [2026-08-16] Узкая правая половина составной кнопки «шаблон + стрелка». Раньше её ширина
   задавалась inline-стилем `padding: 8px 6px` в разметке вместе с обнулением радиусов,
   которое и без того делает канонический .btn-group (styles/components.css:222-230).
   Здесь остаётся ТОЛЬКО то, чего нет в общем компоненте, — компактный горизонтальный
   паддинг под одну иконку.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §E7. Chat: fish-icons-styles-audit-2026-08-16. */

/* [2026-08-16] Выпадающее меню шаблонов: оформление перенесено из inline-`style` разметки.
   Базовый .dropdown-menu (styles/styles.css:149) позиционируется `right: 0; top: 45px` и
   имеет min-width 320px — под составную кнопку это не подходит, поэтому переопределения
   ровно те, что стояли в разметке: привязка к нижней кромке кнопки слева и своя ширина.
   z-index 1000 сохранён как был: он выше локального 100 базового меню и ниже системных
   уровней (--z-modal-backdrop 1040) — см. пояснение о слоях выше.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §E8, §F3. Chat: fish-icons-styles-audit-2026-08-16. */
.fish-template-dropdown {
    top: 100%;
    left: 0;
    right: auto;
    margin-top: var(--space-1);
    min-width: 200px;
    z-index: 1000;
}

.fish-template-dropdown-scroll {
    padding: var(--space-2) 0;
    max-height: 300px;
    overflow-y: auto;
}

.fish-template-dropdown-hint {
    padding: var(--space-2) var(--space-4);
    color: var(--text-tertiary);
    font-style: italic;
}

/* Chevron size belongs to the active sidebar sections. */
.material-icons.sidebar-section-icon {
    font-size: 20px;
    width: auto;
    height: auto;
}

/* [2026-08-16] Остатки inline-`style` из разметки, перенесённые в таблицу стилей.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §E8. Chat: fish-icons-styles-audit-2026-08-16. */
/* [2026-08-16] УДАЛЕНО правило `.fish-layers-add-row`: строка с заливной кнопкой «Add Layer»
   убрана из тела секции, действие переехало иконкой в заголовок (канон «Pages» в Word).
   Ref: docs/QA_FISH_TO_WORD_ICONS_2026-08-16.md §6. Chat: fish-icons-styles-audit-2026-08-16. */

.fish-profile-curve {
    display: block;
    margin-inline: auto;
}

.fish-section-placeholder {
    padding: var(--space-4);
    text-align: center;
}

.rotation-input.rotation-input-narrow {
    width: 50px;
}

/* ============================================================================
   [2026-08-16] ПАНЕЛЬ ИНСТРУМЕНТОВ FISH = ПАНЕЛЬ МОДУЛЯ DOCUMENTS (PDF/WORD).
   Причина: Fish выглядел чужим — крупные заливные кнопки `.btn btn-primary` /
   `.btn-secondary` / `.btn-danger`, тогда как PDF и Word используют плоскую панель:
   прозрачные кнопки, подсветка на hover, разделители-волоски. (Оговорка про «заливку у
   первичного и опасного действия» СНЯТА 2026-08-16: в разметке Word и PDF заливных кнопок
   панели нет вовсе, см. аннотацию у удалённых правил ниже.) Значения повторяют канон
   modules/documents/css/pdf-toolbar.css:26-82 (.toolbar-group / .toolbar-divider /
   .toolbar-btn), но берут цвета ТОКЕНАМИ, а не литералами вроде #e0e0e0 — сам
   pdf-toolbar.css держит их хардкодом, и копировать этот дефект нельзя (DESIGN.md §15.6).
   Классы объявлены здесь, а не подключением чужого CSS: тянуть 833 строки правил
   PDF-страницы в Fish — недопустимая связность между модулями.
   Ref: docs/AUDIT_FISH_ICONS_STYLES_2026-08-16.md §H.
   Chat: fish-icons-styles-audit-2026-08-16.
   ============================================================================ */

/* Command-row spacing comes from the shared header component. */
/* [2026-08-16] Добавлена нижняя волосяная линия: у `.document-toolbar` она есть
   (modules/documents/css/toolbar.css:16 — `border-bottom: 1px solid var(--border-color)`), а
   панель Fish висела без границы и «сливалась» с холстом — одно из четырёх замеренных отличий
   по замечанию PO «не выглядит как модуль Word».
   Ref: docs/QA_FISH_TO_WORD_ICONS_2026-08-16.md §6. Chat: fish-icons-styles-audit-2026-08-16. */
.fish-toolbar {
    border-bottom: 1px solid var(--border-primary);
}

/* [2026-10-03] Slides: панель — в потоке, без «липкого» смещения. Общее правило header.css даёт
   `.module-controls-row { position: sticky; top: 74px }`, а шапка кончается выше (~62 px): у окна
   Fish разницу закрывала лента видов под панелью, в Slides её нет — и панель наезжала на холст и
   правую панель на 12 px (замер в живом окне 2026-10-03). Страница не прокручивается, липкость
   здесь не нужна. Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.1. Chat: slides-tz-2026-10-02. */
.module-controls-row.fish-toolbar {
    position: relative;
    top: auto;
}

.fish-toolbar .toolbar-group {
    display: flex;
    align-items: center;
    gap: 2px;
    position: relative;
}

.fish-toolbar .toolbar-divider {
    width: 1px;
    height: 24px;
    background: var(--border-primary);
    margin: 0 var(--space-2);
    flex-shrink: 0;
}

/* Один размер области наведения у соседних иконочных команд и переключателя панели. */
.fish-toolbar .toolbar-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-sizing: border-box;
    width: 34px;
    min-width: 34px;
    height: 34px;
    padding: 0;
    border: none;
    background: transparent;
    border-radius: var(--radius-lg);
    cursor: pointer;
    color: var(--text-primary);
    font-family: var(--font-family);
    font-size: 13px;
    line-height: 1.2;
    white-space: nowrap;
    transition:
        background-color var(--transition-fast),
        color var(--transition-fast);
}

.fish-toolbar .toolbar-btn:not(.fish-btn-split) svg {
    width: 20px;
    height: 20px;
}

.fish-toolbar > .ek-right-panel__toggle {
    border-radius: var(--radius-lg);
}

.fish-toolbar #addFromTemplateBtn,
.fish-toolbar #slidesExportBtn {
    width: auto;
    padding-inline: var(--space-2);
}

/* [2026-10-03] Скрытая кнопка панели (и её группа с разделителем) не занимает места: правило `display`
   выше иначе перебивало бы атрибут hidden. Стоит ПОСЛЕ правила кнопки: по специфичности оно и так сильнее,
   но каскад jsdom (наборы видимости) решает порядком — порядок и специфичность теперь согласны.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Показ», «Выпуск»). Chat: slides-tz-2026-10-02. */
.fish-toolbar .toolbar-btn[hidden],
.fish-toolbar .toolbar-group[hidden],
.fish-toolbar .toolbar-divider[hidden] {
    display: none;
}

/* ============================================================================
   [2026-08-16] ОБЩЕЕ ОКНО ОТКРЫТИЯ ФАЙЛОВ — ВЫШЕ ХРОМА СТРАНИЦЫ FISH.

   Дефект пойман браузерным замером, а не на глаз: `elementFromPoint(700, 95)`
   на открытом окне возвращал `.module-controls-row.fish-toolbar`, то есть панель
   инструментов РИСОВАЛАСЬ ПОВЕРХ модалки — заголовок окна с названием и крестиком
   был закрыт кнопками страницы.

   Причина: общий оверлей объявлен с `z-index: 1000`
   (modules/documents/css/document-browser.css:3-10), а хром страницы Fish выше —
   `.module-controls-row` sticky 1019 и универсальная шапка 1030. В Word того же не
   происходит: там панель `position: static` и стекающего контекста не создаёт,
   поэтому дефект и не всплывал до переиспользования окна здесь.

   Правило живёт в fish.css, а не в общем файле: поднимать оверлей глобально —
   менять слои сразу трём модулям без их проверки. Значение берём по шкале
   DESIGN.md §9 (`--z-modal` = 1050 > 1030), а не подбираем число.
   Ref: docs/QA_FISH_OPEN_DIALOG_2026-08-16.md. Chat: fish-icons-styles-audit-2026-08-16.
   ============================================================================ */
.document-browser-overlay {
    z-index: var(--z-modal);
}

/* Файловая группа использует общую область иконочной команды 34×34; класс
   сохраняет запрет сжатия внутри группы при узком рабочем месте. */
.fish-toolbar .fish-file-btn {
    flex-shrink: 0;
}

/* Кнопка сохранения без несохранённых правок — приглушена (состояние, не стиль из JS). */
.fish-toolbar .fish-file-btn.is-pristine {
    opacity: 0.5;
}

/* ============================================================================
   [2026-08-16] ЗНАЧОК МОДУЛЯ — контурный SVG набора js/fishIcons.js (контракт Word).

   ЗДЕСЬ НАМЕРЕННО НЕТ `color`. Значок рисуется `stroke="currentColor"` и обязан брать
   цвет КНОПКИ: `.fish-toolbar .toolbar-btn { color: var(--text-primary) }` выше,
   `.toolbar-btn.active` — `--brand-primary`, `.toolbar-btn.primary` — `--text-inverse`.
   Стоит назначить значку собственный цвет (`.fish-icon { color: var(--text-secondary) }`) —
   и панель станет бледнее словной при полностью совпавшей геометрии: на этой ошибке уже
   поймали модуль таблиц. Единственное, что нужно значку, — не сжиматься во flex-кнопке
   (ровно как `.toolbar-btn svg` в modules/documents/css/toolbar.css:90-92).

   Ref: docs/DEV_GUIDE_FISH_TO_WORD_CONTRACT_2026-08-16.md §1, §3 шаг 3, §4 (ловушка 2).
   Chat: fish-icons-styles-audit-2026-08-16.
   ============================================================================ */
.fish-icon {
    flex-shrink: 0;
}

.fish-toolbar .toolbar-btn:hover:not(:disabled) {
    background: var(--bg-hover);
}

.fish-toolbar .toolbar-btn:active:not(:disabled) {
    background: var(--bg-tertiary);
}

.fish-toolbar .toolbar-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Состояние-переключатель (напр. включённый режим вставки) — тонированная подложка,
   как `.toolbar-btn.active` в панели PDF. */
.fish-toolbar .toolbar-btn.active {
    background: rgba(var(--brand-primary-rgb), 0.12);
    color: var(--brand-primary-text);
}

/* [2026-08-16] УДАЛЕНЫ правила `.toolbar-btn.primary` и `.toolbar-btn.danger` панели Fish.
   Причина: они вводили в панель заливную синюю кнопку и красный текст «Удалить», которых в
   эталоне НЕТ. Проверено по разметке: `toolbar-btn primary` не встречается ни в `edoc.html`,
   ни в `pdf-viewer.html` (правило `css/pdf-toolbar.css:78` мёртвое), а класса
   `.toolbar-btn.danger` в модуле Documents не существует вовсе. Замер живых страниц: в панели
   Word единственный не-прозрачный фон — тонированная подложка включённого переключателя
   (rgb 227,242,253), то есть то же самое, что даёт `.toolbar-btn.active` ниже.
   Ref: docs/QA_FISH_TO_WORD_ICONS_2026-08-16.md §6. Chat: fish-icons-styles-audit-2026-08-16. */

/* Составная кнопка «шаблон + стрелка»: две плоские кнопки, сомкнутые в одну. */
.fish-toolbar .fish-template-group .toolbar-btn:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.fish-toolbar .fish-btn-split {
    padding-left: 4px;
    padding-right: 4px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    /* [2026-08-16] Разделитель половинок был рассчитан на БЕЛЫЙ текст заливной кнопки
       (rgba(--text-inverse-rgb, .25)) и на плоской кнопке стал невидим. Берём цвет границ.
       Ref: docs/QA_FISH_TO_WORD_ICONS_2026-08-16.md §6. Chat: fish-icons-styles-audit-2026-08-16. */
    box-shadow: inset 1px 0 0 var(--border-primary);
}

@media (max-width: 600px) {
    /* Файловые действия прокручиваются в первом ряду; общая кнопка панели всегда рядом. */
    .fish-toolbar #fishDiagramControls {
        order: -2;
        flex: 1 1 calc(100% - 34px - var(--space-2));
        min-width: 0;
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .fish-toolbar #fishDiagramControls::-webkit-scrollbar {
        display: none;
    }

    .fish-toolbar > .ek-right-panel__toggle {
        order: -1;
        position: static;
        margin-left: 0;
    }

    .fish-toolbar #templateBtnLabel {
        display: none;
    }

    .fish-toolbar #addFromTemplateBtn {
        width: 34px;
        padding: 0;
    }
}

/* [2026-08-23] ЗНАЧОК ПРЕДМЕТНОГО ТИПА КОСТИ на схеме.

   Раньше схема о типе не знала вовсе: кость рисовалась как кость, был это насос или задвижка.
   Значок берётся из набора модуля в контракте Word (контур 24×24, `fill: none`,
   `stroke: currentColor`), поэтому здесь задаётся ТОЛЬКО цвет группы — сам значок цвета себе
   не назначает (запрет вшит в fishIcons.js: правило вида `.fish-icon { color: … }` запрещено,
   именно оно делало панель бледнее словной).

   `pointer-events: none` обязателен: значок лежит поверх кости, и без него он перехватывал бы
   клики выбора и перетаскивания — кость стала бы неподвижной под собственным значком.

   Ref: docs/TZ_FISH_BONE_SHAPE_END_TO_END_2026-08-23.md P2.2. Chat: fish-icons-styles-audit-2026-08-16. */
.bone-type-mark {
    color: var(--text-primary);
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}

/* [2026-08-23] Меню объекта длинное (17 пунктов), а страница модуля не прокручивается
   (`body { height: 100vh; overflow: hidden }`) — без ограничения высоты нижние пункты уходили
   за край экрана и были недоступны никак. Прокрутка идёт ВНУТРИ меню.
   Найдено вторым мнением 2026-08-23.
   Ref: docs/TZ_FISH_BONE_SHAPE_END_TO_END_2026-08-23.md P2bis.2. */
.context-menu {
    max-height: calc(100vh - 16px);
    overflow-y: auto;
}

/* [2026-08-23] МЕНЮ ДЕЙСТВИЙ НАД ОБЪЕКТОМ — разделитель и выключенный пункт.

   Меню объекта длиннее прежнего (одна «Отмена»), поэтому группы разделяются линией, а пункты,
   которым нужно несколько выделенных костей, при одной выделенной ВЫКЛЮЧЕНЫ: меню не должно
   предлагать действие, которое ничего не сделает — тот же принцип, что у кнопки «Вставить».

   Ref: docs/TZ_FISH_BONE_SHAPE_END_TO_END_2026-08-23.md P2bis.2, P2bis.3.
   Chat: fish-icons-styles-audit-2026-08-16. */
.context-menu-separator {
    height: 1px;
    margin: var(--space-1) 0;
    background-color: var(--border-primary);
}

.context-menu-item.is-disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

/* Значок пункта меню отделён от подписи и наследует цвет пункта — как во всём наборе. */
.context-menu-item .fish-icon {
    margin-right: var(--space-2);
    flex-shrink: 0;
}

/* [2026-08-23] ПАЛИТРА ПРЕДМЕТНЫХ ФИГУР СХЕМЫ (P2.3).

   Панель поверх холста, кнопки в ряд, выбранная подсвечена ([2026-10-03] ссылка на снятый
   3D-хотбар убрана, ТЗ Slides §4.2. Chat: slides-tz-2026-10-02). Отличие одно и намеренное — палитра стоит СЛЕВА по вертикали, а не по
   центру снизу: снизу в схеме проходит универсальный нижний баннер, и вторая панель там
   перекрыла бы его.

   Цвет значка берётся от кнопки (`currentColor`) — сам значок цвета себе не назначает, запрет
   вшит в fishIcons.js.

   Ref: docs/TZ_FISH_BONE_SHAPE_END_TO_END_2026-08-23.md P2.3. Chat: fish-icons-styles-audit-2026-08-16. */
.fish-type-palette {
    position: absolute;
    top: var(--space-4);
    left: var(--space-4);
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-2);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    border: 1px solid var(--border-primary);
    box-shadow: var(--shadow-lg);
    max-height: calc(100% - var(--space-8));
    overflow-y: auto;
}

/* [2026-08-23] Своё правило скрытия у палитры ОБЯЗАТЕЛЬНО: общая утилита `.hidden` объявлена
   в styles/styles.css, а `display: flex` палитры идёт в файле модуля — то есть ПОЗЖЕ по порядку
   подключения. Полагаться на `!important` из чужого файла значит зависеть от порядка загрузки
   стилей; равная по весу пара «класс + класс» снимает этот вопрос.
   Ref: docs/TZ_FISH_BONE_SHAPE_END_TO_END_2026-08-23.md P2.3. */
.fish-type-palette.hidden {
    display: none;
}

.fish-type-palette .palette-group {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-bottom: var(--space-1);
    border-bottom: 1px solid var(--border-primary);
}

.fish-type-palette .palette-group:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.fish-type-palette .palette-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-primary);
    cursor: pointer;
    transition: background-color var(--transition-fast);
}

.fish-type-palette .palette-btn:hover {
    background-color: var(--bg-secondary);
}

.fish-type-palette .palette-btn.active {
    background-color: var(--color-info-light);
    border-color: var(--color-info);
}

/* [2026-10-03] Slides: библиотека фигур — панель у левого края холста, СТРОКИ «значок + название»
   по группам-дисциплинам с заголовками и поиском сверху. Панель примыкает к краю без коробки:
   без скругления и тени, отделена одной линией (DESIGN.md §4 «Лэйаут страницы»).
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.2, §3.5.3 п.3. Chat: slides-tz-2026-10-02. */
/* [2026-10-14] Библиотека фигур — в разделе «Фигуры» правой панели, в потоке тела раздела: без своего места у края
   холста, ширины, линии справа и отступа (отступ даёт тело раздела, прокрутку — тоже оно).
   Ref: приказ PO 2026-10-14 «перенеси показ миниатюр и раздел фигур в универсальную правую панель».
   Chat: docstore-stage2-2026-10-11. */
.fish-type-palette {
    position: static;
    width: auto;
    max-height: none;
    overflow: visible;
    gap: var(--space-3);
    padding: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background-color: transparent;
}

.fish-type-palette .palette-search {
    width: 100%;
    flex-shrink: 0;
}

/* [2026-10-14] Левая колонка Slides («Страницы» + «Фигуры» у левого края холста, `.slides-left-panel`) снята:
   оба раздела — в правой панели (`#right-sidebar-panel`, разделы `pages` и `shapes`). «Страницы» — в потоке тела
   раздела: без своей высоты в 45 % колонки, линий справа и снизу и отступа (их даёт раздел).
   Ref: приказ PO 2026-10-14 «перенеси показ миниатюр и раздел фигур в универсальную правую панель как это сделано у
   всех других модулей»; DESIGN.md §4 «Лэйаут страницы». Chat: docstore-stage2-2026-10-11. */
.slides-pages {
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    /* [2026-10-14] Во всю высоту тела раздела: листается только список страниц (`.slides-pages-list`), а не ещё и
       тело раздела — живая проверка показала две полосы прокрутки рядом. */
    height: 100%;
}

.slides-pages .slides-pages-list {
    flex: 1 1 auto;
    /* [2026-10-26] Список страниц не сжимается в ноль: при нижнем пределе тела раздела (240 px) постоянные поля
       раздела (формат, поиск, «+ Страница», «Раздел», «Граф из файла», «Слайды из PowerPoint» — ~230 px) забирали всю
       высоту, и ни одной строки слайда не было видно (живая приёмка E2.6, снимок окна 1400×880). Три полные строки:
       строка с эскизом и действиями — ~62 px (снимки прогона 10: при 132 px видно две, подпись «Правит» срезана).
       Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md, этап 2 (E2.6). Chat: slides-deckcraft-parity-part2-2026-10-18. */
    min-height: 192px;
}

.slides-pages.hidden {
    display: none;
}

/* [2026-10-03] Заголовок раздела с переключателем формата листа и эскиз страницы в строке (этап 6).
   Эскиз — из данных страницы, в рамке-линии; текущая строка по-прежнему отмечена полосой и жирным.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4. Chat: slides-tz-2026-10-02. */
.slides-pages-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}

.slides-sheet-format {
    width: auto;
}

/* Keep inspector controls subordinate to their 44px section headers. The
   shared .input and .input-field defaults have different desktop heights. */
.right-sidebar :is(.input, .input-field) {
    box-sizing: border-box;
    height: 34px;
    padding: var(--space-2) var(--space-3);
    font-size: 12.5px;
}

.slides-page-thumb {
    display: inline-flex;
    flex: 0 0 auto;
    line-height: 0;
    border: 1px solid var(--border-primary);
    border-radius: 2px;
    overflow: hidden;
}

.slides-page-row:has(.slides-page-thumb) {
    height: 44px;
}

.slides-page-row:has(.slides-page-thumb):has(.slides-page-actions) {
    height: auto;
}

/* [2026-10-25] Совместная правка: имя того, кто правит слайд в другом окне (E2.4), — третьей строкой под действиями;
   значок конфликта слияния (E2.3) — цветом ошибки в строке имени. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md,
   «Уточнение E2» п.3–4. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-page-row:has(.slides-page-editor) {
    height: auto;
}

.slides-page-editor {
    grid-column: 3;
    grid-row: 3;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--font-size-xs);
    color: var(--brand-primary);
}

.slides-page-conflict-mark {
    display: inline-flex;
    flex: 0 0 auto;
    color: var(--color-error);
}

.slides-pages-title {
    padding: var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.slides-pages-list {
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

/* [2026-10-22] Строки списка (страницы и разделы) не сжимаются: список ниже содержимого листается, а не сплющивает
   строки. Было: сжатие по умолчанию у элементов колонки flex сводило строку с кнопками 34 px (`0bfbcc9c3`) к её
   `min-height: 44px`, и кнопки строки ложились на следующую строку (окно 1600×900, список 67 px).
   Ref: docs/QA_SLIDES_DECKCRAFT_PARITY_PART2_E0_2026-10-22.md («Найдено в окне»).
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-pages-list > * {
    flex-shrink: 0;
}

/* [2026-10-11] Поиск по содержимому колод компании: поле, строка состояния и найденное строками (имя файла
   сверху, найденный текст под ним). Список ограничен по высоте и прокручивается сам — панель страниц под ним
   не уезжает. Ref: docs/TZ_MONGO_FILE_STORE_2026-10-11.md §4.2 п.7. Chat: slides-tz-2026-10-02. */
.slides-deck-search {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

/* [2026-10-14] Правило «пока показаны находки, „Страницы“ — 70 % колонки» снято вместе с колонкой: высоту теперь
   даёт раздел правой панели. Ref: приказ PO 2026-10-14 (миниатюры и фигуры — в правую панель).
   Chat: docstore-stage2-2026-10-11. */
.slides-deck-search-input {
    width: 100%;
    box-sizing: border-box;
}

.slides-deck-search-status {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

/* Не больше трёх строк найденного: панель «Страницы» ограничена 45 % высоты (`.slides-pages`), и список
   находок в 40vh вытеснял список страниц целиком (живая проверка 2026-10-11). */
.slides-deck-search-results {
    max-height: 132px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--border-primary);
}

.slides-deck-search-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    cursor: pointer;
}

.slides-deck-search-row:hover,
.slides-deck-search-row:focus-visible {
    background-color: var(--bg-secondary);
    outline: none;
}

.slides-deck-search-file {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slides-deck-search-text {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* [2026-10-03] Строка — сетка: номер и эскиз слева, справа имя сверху и действия под ним. Прежде всё
   стояло в одну линию, и на наведении три кнопки сжимали имя до «P…» (живая проверка 2026-10-03).
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Панель „Страницы“»). Chat: slides-tz-2026-10-02. */
.slides-page-row {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: var(--space-2);
    min-height: 44px;
    padding: var(--space-1) var(--space-1) var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    cursor: pointer;
}

.slides-page-row:hover {
    background-color: var(--bg-secondary);
}

.slides-page-row.is-current {
    background-color: var(--brand-primary-bg);
}

.slides-page-row.is-current .slides-page-name {
    font-weight: var(--font-weight-semibold);
}

.slides-page-number {
    min-width: 1.5em;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    text-align: right;
}

.slides-page-name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: var(--font-size-sm);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.slides-page-name-input {
    flex: 1 1 auto;
    min-width: 0;
    height: 24px;
    padding: 0 var(--space-1);
    font-size: var(--font-size-sm);
}

/* [2026-10-03] Номер и эскиз — на обе строки сетки; имя — первая строка, действия — вторая. Действия
   прячутся видимостью, а не display: строка не прыгает по высоте на наведении. Ref: ТЗ Slides §3.5.4. */
.slides-page-number,
.slides-page-thumb {
    grid-row: 1 / span 2;
}

.slides-page-name,
.slides-page-name-input {
    grid-column: 3;
    grid-row: 1;
}

.slides-page-actions {
    grid-column: 3;
    grid-row: 2;
    display: inline-flex;
    flex-wrap: wrap;
    max-width: 100%;
    gap: 2px;
    visibility: hidden;
}

.slides-page-row:hover .slides-page-actions,
.slides-page-row:focus-within .slides-page-actions {
    visibility: visible;
}

.slides-page-action {
    width: 34px;
    height: 34px;
    box-sizing: border-box;
    padding: 0;
    border: 1px solid transparent;
    border-radius: var(--radius-lg);
    flex: 0 0 34px;
}

.slides-page-action > svg {
    width: 20px;
    height: 20px;
}

.slides-page-action:focus-visible {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

.slides-page-add {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 34px;
    padding: 0 var(--space-2);
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
    cursor: pointer;
}

.slides-page-add:hover {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

.slides-page-add[hidden] {
    display: none;
}

/* [2026-10-03] Заметки докладчика: полоса у нижнего края холста правее левой панели, без коробки —
   отделена одной линией сверху; свёрнута — только строка-кнопка, раскрыта — поле текста.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Заметки докладчика»). Chat: slides-tz-2026-10-02. */
.slides-notes {
    position: absolute;
    /* [2026-10-14] От левого края холста: левой колонки «Страницы/Фигуры» больше нет (разделы правой панели).
       Было left: 232px. Ref: приказ PO 2026-10-14. Chat: docstore-stage2-2026-10-11. */
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    height: 160px;
    display: flex;
    flex-direction: column;
    background-color: var(--bg-primary);
    border-top: 1px solid var(--border-primary);
}

.slides-notes.hidden {
    display: none;
}

.slides-notes.is-collapsed {
    height: auto;
}

.slides-notes.is-collapsed .slides-notes-text {
    display: none;
}

.slides-notes-resize {
    height: 6px;
    /* ui-canon-allow SPACING_OFF_SCALE: half of the six-pixel drag target straddles the notes border. */
    margin-top: -3px;
    cursor: ns-resize;
}

.slides-notes-toggle {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    align-self: flex-start;
    box-sizing: border-box;
    min-height: 34px;
    height: auto;
    padding: 0 var(--space-3);
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text-secondary);
    font-family: var(--font-family);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    cursor: pointer;
}

.slides-notes-toggle:hover {
    background: var(--bg-hover);
}

.slides-notes-toggle:focus-visible {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: none;
}

.slides-notes-text {
    flex: 1 1 auto;
    min-height: 0;
    margin: 0 var(--space-3) var(--space-3);
    resize: none;
    font-size: var(--font-size-sm);
}

/* [2026-10-29] Строка состояния под холстом (E4.4): одна строка у нижнего края холста, без коробки — отделена одной
   линией сверху, как полоса заметок; полоса заметок и сетка сортировщика поднимаются над ней, страница не
   прокручивается (высота строки — внутри холста). Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md
   «Уточнение E4» E4.4. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-statusbar {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 46;
    box-sizing: border-box;
    height: var(--space-7);
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: 0 var(--space-3);
    overflow: hidden;
    white-space: nowrap;
    background-color: var(--bg-primary);
    border-top: 1px solid var(--border-primary);
    color: var(--text-secondary);
    font-family: var(--font-family);
    font-size: var(--font-size-xs);
}

.slides-statusbar[hidden],
.slides-statusbar-item[hidden] {
    display: none;
}

.slides-statusbar-item {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.slides-statusbar-end {
    margin-left: auto;
}

.slides-statusbar:not([hidden]) ~ .slides-notes {
    bottom: var(--space-7);
}

/* [2026-10-29] Строка состояния — по видимой части холста: правая панель лежит поверх холста (`.right-sidebar` absolute,
   ширина `--ek-right-panel-width`), и «Вид» и масштаб (`.slides-statusbar-end`, прижаты вправо) уходили под неё (живая
   приёмка E4, e2e/slides-e4-live.spec.js: правый край 1388 px при левом крае панели 1060 px). То же правило, что у
   подсказки пустого холста выше. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E4» E4.4.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.fish-main-container:not(.right-sidebar-collapsed) .slides-statusbar {
    right: var(--ek-right-panel-width, 340px);
}

/* [2026-10-29] Строка итога — по центру видимой части холста, то же правило правой панели (живая приёмка E5: «Выпуск…»
   стоял по центру контейнера вместе с зоной под панелью). Ref: docs/QA_SLIDES_DECKCRAFT_PARITY_PART2_E5_2026-10-29.md §5.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.fish-main-container:not(.right-sidebar-collapsed) .slides-export-result {
    left: calc((100% - var(--ek-right-panel-width, 340px)) / 2);
    max-width: calc(100% - var(--ek-right-panel-width, 340px) - 2 * var(--space-4));
}

#canvasContainer:has(> .slides-statusbar:not([hidden])) > .slides-sorter {
    bottom: var(--space-7);
}

/* [2026-10-29] Палитра команд (E4.2): одна плавающая панель у верхнего края холста — поле поиска и строки команд
   (строка целиком кликабельна, клавиша справа), поля параметров выбранной команды в той же панели. Плавающая
   поверхность — фон, линия и тень токенами; внутри без вложенных коробок. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md
   «Уточнение E4» E4.2. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-palette {
    position: absolute;
    top: var(--space-4);
    left: 50%;
    transform: translateX(-50%);
    z-index: 60;
    box-sizing: border-box;
    width: min(560px, calc(100% - var(--space-8)));
    max-height: calc(100% - var(--space-16));
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-2);
    overflow: hidden;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    color: var(--text-primary);
    font-family: var(--font-family);
}

.slides-palette[hidden],
.slides-palette [hidden] {
    display: none;
}

.slides-palette-list {
    flex: 1 1 auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-y: auto;
}

.slides-palette-row {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-sm);
    cursor: pointer;
}

.slides-palette-row:hover,
.slides-palette-row.is-active {
    background-color: var(--bg-hover);
}

.slides-palette-label {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slides-palette-id {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-tertiary);
    font-family: var(--font-family-mono);
    font-size: var(--font-size-xs);
}

.slides-palette-key {
    flex: 0 0 auto;
    padding: 0 var(--space-1);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-family: var(--font-family-mono);
    font-size: var(--font-size-xs);
}

.slides-palette-empty {
    padding: var(--space-2) var(--space-3);
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
}

.slides-palette-params {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    min-height: 0;
    overflow-y: auto;
}

.slides-palette-command {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
}

.slides-palette-fields {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.slides-palette-field {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.slides-palette-field.is-check {
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: center;
    gap: var(--space-2);
}

.slides-palette-actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
}

.slides-palette-status {
    color: var(--color-error);
    font-size: var(--font-size-xs);
}

/* [2026-10-03] Показ: страница во весь экран на чёрном поле, лист вписан с сохранением пропорций.
   Панель «3 / 7 · назад · вперёд · выход» внизу появляется при движении мыши и прячется, когда мышь
   замерла. Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §3.5.4 («Показ»). Chat: slides-tz-2026-10-02. */
.slides-show {
    position: fixed;
    inset: 0;
    z-index: 10000;
    /* ui-canon-allow COLOR_LITERAL: presentation canvas stays black across themes so uncovered slide edges do not flash. */
    background: #000000;
    cursor: none;
}

.slides-show.is-bar-visible {
    cursor: default;
}

.slides-show-stage {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slides-show-stage .slides-show-page {
    width: 100%;
    height: 100%;
}

/* [2026-10-04] Слой страницы показа: при переходе слайда прежний и новый слои лежат друг на друге, кадр перехода
   ставит им прозрачность, сдвиг и вырез. Ref: docs/TZ_SLIDES_PPTX_COMPAT_2026-10-04.md §3, §10 п.3.
   Chat: slides-tz-2026-10-02. */
.slides-show-layer {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    /* ui-canon-allow COLOR_LITERAL: transition layers share the fixed black presentation canvas. */
    background: #000000;
}

.slides-show-bar {
    position: absolute;
    left: 50%;
    bottom: var(--space-4);
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-md);
    /* ui-canon-allow COLOR_LITERAL: a fixed dark scrim keeps controls readable over arbitrary slide artwork. */
    background: rgba(17, 24, 39, 0.85);
    color: var(--text-inverse);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--transition-fast);
}

.slides-show.is-bar-visible .slides-show-bar {
    opacity: 1;
    pointer-events: auto;
}

.slides-show-counter {
    min-width: 4em;
    text-align: center;
    font-size: var(--font-size-sm);
}

.slides-show-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: none;
    border-radius: var(--radius-lg);
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.slides-show-btn:hover {
    background: rgba(var(--text-inverse-rgb), 0.12);
}

.slides-show-btn:focus-visible {
    outline: none;
    box-shadow: inset 0 0 0 1px var(--text-inverse);
}

/* [2026-10-03] Полоса «диаграмма открыта на просмотр» — строкой на холсте, без окна.
   Ref: docs/TZ_SLIDES_MODULE_2026-10-02.md §4.1, §4.3. Chat: slides-tz-2026-10-02. */
.slides-convert-bar {
    position: absolute;
    top: var(--space-3);
    left: 50%;
    transform: translateX(-50%);
    z-index: 6;
    display: flex;
    align-items: center;
    gap: var(--space-3);
    max-width: calc(100% - 2 * var(--space-4));
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    color: var(--text-primary);
    font-size: var(--font-size-sm);
}

.slides-convert-bar.is-error .slides-convert-text {
    color: var(--color-error-text);
}

.fish-type-palette .palette-group {
    gap: 0;
    padding-bottom: var(--space-2);
}

.fish-type-palette .palette-group[hidden],
.fish-type-palette .palette-row[hidden] {
    display: none;
}

.fish-type-palette .palette-group-title {
    padding: var(--space-1) var(--space-1) var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.fish-type-palette .palette-row {
    justify-content: flex-start;
    gap: var(--space-2);
    width: 100%;
    height: 32px;
    padding: 0 var(--space-2);
    text-align: left;
}

.fish-type-palette .palette-row-name {
    font-size: var(--font-size-sm);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* [2026-10-04] Строка библиотеки символов: миниатюра символа, название и вторая строка (вид позиции или «без
   изделия»). Ref: docs/TZ_SLIDES_PPTX_COMPAT_2026-10-04.md §4.0 пп. 1–5. Chat: slides-tz-2026-10-02. */
.fish-type-palette .palette-row {
    height: auto;
    min-height: 36px;
    padding-top: var(--space-1);
    padding-bottom: var(--space-1);
}

.fish-type-palette .palette-symbol {
    flex: 0 0 20px;
    color: var(--text-primary);
}

.fish-type-palette .palette-row-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.2;
}

.fish-type-palette .palette-row-sub {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* [2026-08-23] ГАБАРИТНАЯ РАМКА ВЫДЕЛЕНИЯ И РУЧКИ МАСШТАБА (P2bis.4).

   Раньше рамки не было вовсе: масштаб задавался только полем и кнопками, а точки кости тянут её
   ДЛИНУ, а не масштабируют фигуру.

   Сама рамка указатель НЕ перехватывает — иначе она накрыла бы выделенные кости и взять их
   стало бы нечем. Ручки, наоборот, его принимают: за них и тянут.

   Ref: docs/TZ_FISH_BONE_SHAPE_END_TO_END_2026-08-23.md P2bis.4. Chat: fish-icons-styles-audit-2026-08-16. */
.bone-resize-box {
    fill: none;
    stroke: var(--color-info);
    stroke-width: 1;
    stroke-dasharray: 4 3;
    pointer-events: none;
}

.bone-resize-handle {
    fill: var(--bg-primary);
    stroke: var(--color-info);
    stroke-width: 1.5;
}

.bone-resize-handle:hover {
    fill: var(--color-info-light);
}
/* Catalog/class files open their own editor, without scene editing controls. */
.fish-engineering-file #fish-main-container,
.fish-engineering-file #addFromTemplateBtn,
.fish-engineering-file #templateDropdownBtn,
.fish-engineering-file #deleteBoneBtn,
.fish-engineering-file #divideBoneBtn,
.fish-engineering-file #copyBoneBtn,
.fish-engineering-file #pasteBoneBtn,
.fish-engineering-file #undoBtn,
.fish-engineering-file #redoBtn {
    display: none;
}

/* [2026-10-18] Сортировщик слайдов (D7.1): сетка эскизов поверх холста, правый край — у левой границы правой панели
   (slideSorter.js считает `right`). Текущий слайд — рамкой цвета выбора, скрытый — приглушён, место вставки при
   перетаскивании — полосой слева / справа ячейки (как у эталона DeckCraft, `ui-egui/src/sorter.rs`). Разделы —
   строкой на всю ширину сетки. Без боксов-обёрток: фон холста, отступы токенами.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D7.1. Chat: slides-deckcraft-parity-2026-10-17. */
.slides-sorter {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 45;
    overflow-y: auto;
    background-color: var(--bg-secondary);
    padding: var(--space-4) var(--space-6);
}

.slides-sorter[hidden] {
    display: none;
}

body.slides-sorter-open #fishTypePalette {
    display: none !important;
}

.slides-sorter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: var(--space-4) var(--space-6);
    align-items: start;
}

.slides-sorter-section {
    grid-column: 1 / -1;
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
    padding-top: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
}

.slides-sorter-section-count {
    font-weight: normal;
    color: var(--text-secondary);
}

.slides-sorter-cell {
    width: 200px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    outline: none;
}

.slides-sorter-thumb {
    line-height: 0;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    background-color: var(--bg-primary);
    min-height: 112px;
    overflow: hidden;
}

.slides-sorter-thumb svg {
    display: block;
    width: 100%;
    height: auto;
}

.slides-sorter-cell.is-current .slides-sorter-thumb {
    border-color: var(--color-info);
    box-shadow: 0 0 0 2px var(--color-info);
}

.slides-sorter-cell:focus-visible .slides-sorter-thumb {
    box-shadow:
        0 0 0 3px var(--color-info-light),
        0 0 0 1px var(--color-info);
}

.slides-sorter-cell.is-hidden .slides-sorter-thumb,
.slides-sorter-cell.is-hidden .slides-sorter-number {
    opacity: 0.45;
}

.slides-sorter-cell.is-dragging {
    opacity: 0.5;
}

.slides-sorter-cell.is-drop-before {
    box-shadow: -4px 0 0 var(--color-info);
}

.slides-sorter-cell.is-drop-after {
    box-shadow: 4px 0 0 var(--color-info);
}

.slides-sorter-caption {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    padding-top: var(--space-1);
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.slides-sorter-mark {
    display: inline-flex;
    color: var(--text-secondary);
}

/* [2026-10-18] Кнопка сортировщика — только у файла со страницами (D7.1). Chat: slides-deckcraft-parity-2026-10-17. */
body:not(.slides-has-pages) .slides-sorter-group {
    display: none;
}

/* [2026-10-18] Группа масштаба страницы-слайда на странице графа скрыта (у графа своя группа, D7.2). Специфичность
   выше `.fish-toolbar .toolbar-group` — скрытие не держится на одном `!important` общего правила выше.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_2026-10-17.md D7.2. Chat: slides-deckcraft-parity-2026-10-17. */
body.slides-graph-page .fish-toolbar .toolbar-group.slides-view-zoom {
    display: none;
}

/* [2026-10-29] Свёрнутые разделы (E4.13): кнопка «свернуть / развернуть» слева в строке раздела «Страниц» и сортировщика
   (видна всегда, не только при наведении), «Раздел вверх» — значок «вниз», повёрнутый на пол-оборота.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E4» E4.13. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-section-row .slides-section-toggle,
.slides-sorter-section-toggle {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    padding: 0;
    color: var(--text-secondary);
}

.slides-sorter-section-toggle {
    align-self: center;
}

.slides-section-up > svg {
    transform: rotate(180deg);
}

/* [2026-10-29] Виды колоды (E4.15–E4.18): «Структура» и «Страница заметок» — поверх холста, как сортировщик (правый
   край — у левой границы правой панели задаёт расположение холста; без боксов-обёрток, отступы токенами); «Чтение» —
   показ внутри холста окна; «Оттенки серого» — фильтр отрисовки холста, сортировщика, листа заметок и показа.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E4» E4.15–E4.18.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-view-pane {
    position: absolute;
    inset: 0;
    z-index: 45;
    overflow-y: auto;
    background-color: var(--bg-secondary);
    padding: var(--space-4) var(--space-6);
}

.slides-view-pane[hidden] {
    display: none;
}

body.slides-view-outline #fishTypePalette,
body.slides-view-notes-page #fishTypePalette,
body.slides-view-reading #fishTypePalette {
    display: none !important;
}

.slides-view-btn.is-active {
    color: var(--color-info);
}

.slides-outline-slide {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--border-color);
}

.slides-outline-slide.is-hidden .slides-outline-head {
    opacity: 0.55;
}

.slides-outline-head {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
    cursor: pointer;
    outline: none;
}

.slides-outline-slide.is-current .slides-outline-head {
    color: var(--color-info);
}

.slides-outline-head:focus-visible {
    box-shadow: 0 0 0 2px var(--color-info-light);
}

.slides-outline-number {
    min-width: 2em;
    color: var(--text-secondary);
    font-weight: normal;
}

.slides-outline-text,
.slides-notes-page-text {
    width: 100%;
    resize: vertical;
    font-size: var(--font-size-sm);
}

.slides-outline-text {
    margin-left: calc(2em + var(--space-2));
    width: calc(100% - 2em - var(--space-2));
}

.slides-notes-page-sheet {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    max-width: 640px;
}

.slides-notes-page-slide {
    line-height: 0;
    border: 1px solid var(--border-color);
    background-color: var(--bg-primary);
}

.slides-notes-page-slide svg {
    display: block;
    width: 100%;
    height: auto;
}

.slides-notes-page-caption {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.slides-notes-page-text {
    min-height: 160px;
}

.slides-show.is-reading {
    position: absolute;
    z-index: 46;
    cursor: default;
}

/* [2026-10-29] «Чтение» — по видимой части холста: при открытой правой панели слайд уходил под неё, а полоса показа
   стояла по центру всего окна (живая приёмка E4: сцена 0–1400 px при панели 1060–1400 px). То же правило, что у
   подсказки пустого холста и строки состояния. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md
   «Уточнение E4» E4.17. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.fish-main-container:not(.right-sidebar-collapsed) .slides-show.is-reading {
    right: var(--ek-right-panel-width, 340px);
}

body.slides-grayscale #diagramCanvas,
body.slides-grayscale .slides-sorter-thumb,
body.slides-grayscale .slides-notes-page-slide,
body.slides-grayscale .slides-show-stage {
    filter: grayscale(1);
}

/* [2026-10-29] Раздел «Специальные возможности» (E4.19): находки строками — номер слайда, что не так, имя элемента;
   строка кликабельна целиком. Только у файла со страницами. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md
   «Уточнение E4» E4.19. Chat: slides-deckcraft-parity-part2-2026-10-18. */
body:not(.slides-has-pages) #slidesAccessibilitySection {
    display: none;
}

.slides-a11y-row {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    cursor: pointer;
    outline: none;
}

.slides-a11y-row:hover,
.slides-a11y-row:focus-visible {
    background-color: var(--bg-hover);
}

.slides-a11y-number {
    min-width: 1.5em;
    color: var(--text-secondary);
}

.slides-a11y-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.slides-a11y-detail {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.slides-a11y-empty {
    padding: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.slides-a11y-empty[hidden] {
    display: none;
}

/* [2026-10-29] Раздел «Область выделения» (E6.22, E6.24): элементы слайда строками — поле имени, глаз, замок; строка
   выделенного элемента подсвечена, скрытого — приглушена; перетаскивание строки — порядок наложения. Раздел «Действие и
   замещающий текст» (E6.1, E6.25) — поля столбцом. Только у файла со страницами.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E6» E6.1, E6.22, E6.24, E6.25.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
body:not(.slides-has-pages) #slidesSelectionSection,
body:not(.slides-has-pages) #slidesElementActionSection {
    display: none;
}

.slides-selpane-row {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    cursor: pointer;
    outline: none;
}

.slides-selpane-row:hover,
.slides-selpane-row:focus-visible {
    background-color: var(--bg-hover);
}

.slides-selpane-row.is-selected {
    background-color: var(--brand-primary-bg);
}

.slides-selpane-row.is-hidden .slides-selpane-name {
    color: var(--text-secondary);
}

.slides-selpane-row.is-dragging {
    opacity: 0.5;
}

.slides-selpane-name {
    flex: 1;
    min-width: 0;
}

.slides-selpane-empty,
.slides-elact-empty {
    padding: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.slides-selpane-empty[hidden],
.slides-elact-empty[hidden],
.slides-elact-body[hidden],
.slides-elact-slide-row[hidden],
.slides-elact-url-row[hidden] {
    display: none;
}

.slides-elact-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.slides-elact-check {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
}

/* [2026-10-29] Раздел «Формат фона» (E5.11, E5.12, E5.4): поля столбцом, группы вида фона, флажки строкой, действия
   рядом. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E5» E5.11, E5.12, E5.4.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-bg-options {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-2);
}

.slides-bg-options .slides-props-wide .input-field,
.slides-bg-group .input-field {
    width: 100%;
}

.slides-bg-group {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.slides-bg-group[hidden],
.slides-bg-options [hidden] {
    display: none;
}

.slides-bg-check {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
}

.slides-bg-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.slides-bg-target,
.slides-bg-picture-state {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

/* [2026-10-29] Режим образца принятой колоды (E5.4): заполнители части на холсте — штриховой рамкой с подписью вида, не
   масштабируются с холстом; строка мастера в едином списке «Макеты» (п.3) — выбираемая, текущая цель — выделена.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E5» E5.4, п.3. Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-layouts-list .slides-layouts-master[data-master-key] {
    cursor: pointer;
    border-radius: var(--radius-sm);
}

.slides-layouts-list .slides-layouts-master[data-master-key]:hover {
    background-color: var(--bg-secondary);
}

.slides-layouts-list .slides-layouts-master[aria-selected='true'] {
    background-color: var(--brand-primary-bg);
}

#diagramCanvas .slides-part-placeholder-frame {
    fill: none;
    stroke: var(--text-secondary);
    stroke-width: 1;
    stroke-dasharray: 6 4;
    vector-effect: non-scaling-stroke;
}

#diagramCanvas .slides-part-placeholder-label {
    fill: var(--text-secondary);
    font-size: 16px;
}

/* [2026-10-29] Макеты: галерея «+ Страница» (E5.1) и раздел «Макеты» «Оформления» (E5.5, E5.3) — строки с эскизом и
   именем, без коробок; действия строки — при наведении, как у строк «Страниц»; выбранная строка — фоном.
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E5» E5.1, E5.5, п.3.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-page-layouts {
    display: flex;
    flex-direction: column;
    max-height: 320px;
    overflow-y: auto;
}

.slides-layout-thumb {
    flex: 0 0 auto;
    width: 48px;
    height: 27px;
}

.slides-layout-thumb-sheet {
    fill: var(--bg-primary);
    stroke: var(--border-primary);
    stroke-width: 2%;
    vector-effect: non-scaling-stroke;
}

.slides-layout-thumb-ph {
    fill: var(--bg-secondary);
    stroke: var(--text-tertiary);
    vector-effect: non-scaling-stroke;
}

.slides-layout-thumb-footer {
    fill: none;
    stroke: var(--border-hover);
    vector-effect: non-scaling-stroke;
}

.slides-layout-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
}

.slides-layouts[hidden],
.slides-layouts-kinds[hidden] {
    display: none;
}

.slides-layouts {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.slides-layouts-list {
    display: flex;
    flex-direction: column;
    max-height: 360px;
    overflow-y: auto;
}

.slides-layouts-master {
    padding: var(--space-2) var(--space-2) var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
}

.slides-layout-row {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 34px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    font-size: var(--font-size-sm);
    cursor: pointer;
}

.slides-layout-row:hover {
    background-color: var(--bg-hover);
}

.slides-layout-row[aria-selected='true'] {
    background-color: var(--bg-secondary);
}

.slides-layout-row .slides-page-actions {
    display: inline-flex;
    flex: 0 0 auto;
}

.slides-layout-row:hover .slides-page-actions,
.slides-layout-row:focus-within .slides-page-actions {
    visibility: visible;
}

.slides-layout-name-input {
    flex: 1 1 auto;
    min-width: 0;
}

.slides-layouts-status {
    margin: 0;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.slides-layouts-status:empty {
    display: none;
}

.slides-layouts-kinds {
    display: flex;
    flex-direction: column;
    padding-left: var(--space-4);
}

/* [2026-10-29] Группа 2 этапа E6 — ручки формы заготовки (E6.2, ромб цвета предупреждения, как у PowerPoint), концы
   соединителя (E6.3, круг цвета выбора), подсвеченная точка прилипания под указателем, черновик полилинии / кривой /
   рисованной (E6.5); раздел «Фигура» (E6.6, E6.7) — строки объединения и список заготовок, строка состояния на месте.
   Ручки не масштабируются с холстом (размер считает `shapeHandles.js` по масштабу вида).
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E6» E6.2–E6.7.
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
#diagramCanvas .slides-adjust-handle {
    fill: var(--color-warning);
    stroke: var(--bg-primary);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
    cursor: pointer;
}

#diagramCanvas .slides-connector-end {
    fill: var(--bg-primary);
    stroke: var(--color-info);
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
    cursor: crosshair;
}

#diagramCanvas .slides-connector-end.is-glued {
    fill: var(--color-info);
}

#diagramCanvas .slides-glue-site {
    fill: var(--color-info);
    stroke: var(--bg-primary);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
}

#diagramCanvas .slides-path-draft {
    fill: none;
    stroke: var(--color-info);
    stroke-width: 1.5;
    stroke-dasharray: 4 3;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
}

body:not(.slides-has-pages) #slidesShapeFormatSection {
    display: none;
}

.slides-shapefmt-empty,
.slides-shapefmt-status {
    padding: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.slides-shapefmt-empty[hidden],
.slides-shapefmt-body[hidden],
.slides-shapefmt-status[hidden] {
    display: none;
}

.slides-shapefmt-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.slides-shapefmt-body .palette-row-name {
    white-space: normal;
}

/* [2026-10-29] Операции «Объединить фигуры» — строками списка, как строки «Вставки» (`.fish-type-palette .palette-row`):
   стили строк привязаны к той панели, и здесь кнопки рисовались серыми кнопками браузера (живая приёмка E6.6). Список
   «Изменить фигуру» — во всю ширину панели (был срезан до «Вы»). Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md
   «Уточнение E6» E6.6–E6.7; DESIGN.md (списки строками). Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-shapefmt-body .palette-group-title {
    padding: var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.slides-shapefmt-body .slides-shapefmt-merge {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 36px;
    padding: var(--space-1) var(--space-2);
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-primary);
    font: inherit;
    font-size: var(--font-size-sm);
    text-align: left;
    cursor: pointer;
    transition: background-color var(--transition-fast);
}

.slides-shapefmt-body .slides-shapefmt-merge:hover:not(:disabled) {
    background-color: var(--bg-secondary);
}

.slides-shapefmt-body .slides-shapefmt-merge:focus-visible {
    outline: 2px solid var(--color-info);
    outline-offset: -2px;
}

.slides-shapefmt-body .slides-shapefmt-merge:disabled {
    color: var(--text-secondary);
    cursor: default;
    opacity: 0.6;
}

.slides-shapefmt-body .slides-insert-field {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-1) 0;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.slides-shapefmt-body .slides-shapefmt-change {
    width: 100%;
}

/* [2026-10-29] Разделы «Текст» и «Найти и заменить» (textFormatPanel.js, E7): поля столбцом, подписи над полем без
   обрезки многоточием (правая панель 340 px), строки символов, табуляции, найденного и шрифтов колоды — строками, не
   кнопками. Только у файла со страницами. Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E7».
   Chat: slides-deckcraft-parity-part2-2026-10-18. */
body:not(.slides-has-pages) #slidesTextFormatSection,
body:not(.slides-has-pages) #slidesFindReplaceSection {
    display: none;
}

.slides-txt-panel,
.slides-txt-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-2);
}

.slides-txt-body {
    padding: 0;
}

.slides-txt-empty,
.slides-txt-subtitle {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    white-space: normal;
}

.slides-txt-empty[hidden],
.slides-txt-body[hidden],
.slides-txt-panel [hidden] {
    display: none;
}

.slides-txt-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--space-2);
}

.slides-txt-field > span,
.slides-txt-check > span {
    white-space: normal;
    overflow-wrap: anywhere;
}

.slides-txt-panel .slides-txt-field .input-field {
    width: 72px;
}

.slides-txt-panel .slides-txt-wide,
.slides-txt-panel .slides-txt-wide .input-field {
    width: 100%;
}

.slides-txt-symbols,
.slides-txt-tabs,
.slides-find-results,
.slides-find-fonts {
    display: flex;
    flex-direction: column;
    max-height: 240px;
    overflow-y: auto;
}

.slides-txt-symbol-row,
.slides-txt-tab-row,
.slides-find-row,
.slides-find-font-row {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    cursor: pointer;
    border-radius: var(--radius-sm);
}

.slides-find-row {
    flex-direction: column;
    align-items: flex-start;
}

.slides-txt-symbol-row:hover,
.slides-find-row:hover,
.slides-find-font-row:hover,
.slides-find-font-row[aria-selected='true'] {
    background: var(--bg-hover);
}

.slides-txt-symbol-char {
    min-width: var(--space-6);
    font-size: var(--font-size-lg);
}

.slides-txt-symbol-code,
.slides-find-row-snippet {
    color: var(--text-secondary);
    white-space: normal;
    overflow-wrap: anywhere;
}

.slides-txt-tab-label {
    flex: 1;
}

/* [2026-10-29] Полоса правки текста: гарнитура и зачёркивание (E7.1–E7.2). */
.slides-text-format-font {
    max-width: 140px;
}

.slides-text-format-strike {
    max-width: 110px;
}

/* [2026-10-29] Этап E10: покрывало перехода (белая вспышка, E10.1), слой пометок пером и маркером в показе (E10.9),
   вопрос и таймер в полосе показа (E10.9, E10.10), слой просмотра над холстом (E10.8), инструменты холста —
   рукописный ввод и путь перемещения (E10.4, E10.13), строки разделов «Показ» и «Рисование».
   Ref: docs/TZ_SLIDES_DECKCRAFT_PARITY_PART2_2026-10-18.md «Уточнение E10». Chat: slides-deckcraft-parity-part2-2026-10-18. */
.slides-show-trans-cover {
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
}

.slides-show-ink {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 4;
    pointer-events: none;
}

.slides-show-ink.is-drawing {
    pointer-events: auto;
    cursor: crosshair;
}

.slides-show-ink[data-tool='eraser'] {
    cursor: cell;
}

.slides-show-prompt {
    position: absolute;
    left: 50%;
    bottom: calc(var(--space-4) + 48px);
    transform: translateX(-50%);
    z-index: 6;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    /* ui-canon-allow COLOR_LITERAL: the same fixed dark scrim as the show bar keeps the question readable over slides. */
    background: rgba(17, 24, 39, 0.92);
    color: var(--text-inverse);
    font-size: var(--font-size-sm);
}

.slides-show-timer {
    min-width: 7em;
    text-align: center;
    font-size: var(--font-size-sm);
    font-variant-numeric: tabular-nums;
}

.slides-show.is-asking .slides-show-bar {
    opacity: 1;
    pointer-events: auto;
}

.slides-preview {
    position: absolute;
    inset: 0;
    z-index: 30;
    cursor: pointer;
}

.slides-preview-layer {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-secondary);
}

.slides-preview-layer .slides-show-page {
    width: 100%;
    height: 100%;
}

.slides-canvas-tool {
    position: absolute;
    inset: 0;
    z-index: 25;
    cursor: crosshair;
}

.slides-canvas-tool svg {
    pointer-events: none;
    overflow: visible;
}

.slides-canvas-tool[data-tool='eraser'] {
    cursor: cell;
}

.slides-anim-path-actions,
.slides-show-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    padding: var(--space-2);
}

.slides-custom-slide {
    gap: var(--space-2);
}

.slides-transition-group,
.slides-anim-class {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}
