/* ============ ПАНЕЛЬ ЛИСТОВ: перенос pages-card из программы ============
     Геометрия оригинала (ui-left-panel.css): рамка h170 r6, выбор — обводка
     акцентом, подпись «номер-бейдж, имя … формат», зазор карточек 22. */
[data-ui-surface="navigator"] .sheets-list {
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding: var(--arhix-space-block) var(--arhix-space-inset) var(--arhix-space-inset);
    overflow: auto;
  }
[data-ui-surface="navigator"] .sheets-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    gap: 8px;
    cursor: pointer;
    outline: 0;
    user-select: none;
    -webkit-user-select: none;
  }
[data-ui-surface="navigator"] .sheets-card__frame {
    height: 170px;
    border-radius: var(--arhix-radius-pill);
    background: var(--arhix-surface);
    border: 2px solid transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1px 10px;
    box-sizing: border-box;
    transition: border-color var(--arhix-motion-quick) ease;
  }
[data-ui-surface="navigator"] .sheets-card.is-selected .sheets-card__frame { border-color: var(--arhix-accent); }
[data-ui-surface="navigator"] .sheets-card:focus-visible .sheets-card__frame { border-color: var(--arhix-accent); }
[data-ui-surface="navigator"] .sheets-card [contenteditable="true"] {
    user-select: text;
    -webkit-user-select: text;
  }
[data-ui-surface="navigator"] .sheets-card__paper {
    width: auto;
    max-width: 100%;
    height: 152px;
    aspect-ratio: 420 / 297;
    background: var(--arhix-paper); /* бумага листа всегда белая, и в тёмной теме — как в программе */
    /* Бумага сама является границей миниатюры. Дополнительная обводка
       оставляла светлый кант поверх геометрии, доходящей до края листа. */
    border: 0;
    box-shadow: var(--arhix-shadow-paper);
    position: relative;
  }
[data-ui-surface="navigator"] .sheets-card__paper[data-paper-format="a4"] {
    aspect-ratio: 210 / 297;
  }
[data-ui-surface="navigator"] .sheets-card__paper svg { width: 100%; height: 100%; display: block; }
[data-ui-surface="navigator"] .sheets-card__caption {
    display: flex;
    align-items: baseline;
    padding: 0 2px;
    font-family: var(--arhix-font);
    font-size: var(--arhix-font-size-body);
    line-height: 1.25;
    min-width: 0;
  }
[data-ui-surface="navigator"] .sheets-card__index { flex: none; color: var(--arhix-ink-muted); margin-right: 4px; }
[data-ui-surface="navigator"] .sheets-card__name {
    flex: 1 1 0;
    min-width: 0;
    color: var(--arhix-ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    /* закон обрезки: многоточие никогда не упирается в чип —
       поле 8 держится и при длинном имени, и при коротком */
    padding-right: var(--arhix-space-gap);
  }
[data-ui-surface="navigator"] .sheets-card__format {
    flex: none;
    margin-left: auto;
    height: var(--arhix-badge-height);
    display: inline-flex;
    align-items: center;
    padding: 0 6px;
    border-radius: var(--arhix-radius-chip);
    background: var(--arhix-surface);
    color: var(--arhix-ink-muted);
    font-size: var(--arhix-font-size-small);
    font-weight: var(--arhix-font-weight-chrome);
    line-height: 1;
    letter-spacing: 0.4px;
  }


  /* Второе представление тех же карточек. Меняется только раскладка:
     содержимое, порядок, выбор и drag-and-drop остаются у одного DOM. */
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] { gap: var(--arhix-space-row); }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] .sheets-card {
    height: var(--arhix-control-height);
    flex: none;
    gap: 0;
  }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] .sheets-card__frame { display: none; }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] .sheets-card__caption {
    height: var(--arhix-control-height);
    align-items: center;
    padding: 0 var(--arhix-space-gap);
    border-radius: var(--arhix-radius-control);
    background: transparent;
    box-sizing: border-box;
    transition: background var(--arhix-motion-quick) ease;
  }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] .sheets-card:hover .sheets-card__caption {
    background: var(--arhix-surface);
  }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] .sheets-card.is-selected .sheets-card__caption,
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] .sheets-card.is-selected:hover .sheets-card__caption {
    background: var(--arhix-accent-tint);
  }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"].is-selecting .sheets-card.is-selected .sheets-card__caption,
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"].is-selecting .sheets-card.is-selected:hover .sheets-card__caption {
    background: transparent;
  }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"].is-selecting .sheets-card.panel__item--picked .sheets-card__caption,
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"].is-selecting .sheets-card.panel__item--picked:hover .sheets-card__caption {
    background: var(--arhix-accent-tint);
  }


  /* Папка — организация списка, а не разновидность миниатюры. В карточном
     представлении её оболочка исчезает, но порядок и состав сохраняются. */
[data-ui-surface="navigator"] .sheets-list:not(.sheets-list[data-ui-navigator-view="rows"]) > .folder__tab { display: none; }
[data-ui-surface="navigator"] .sheets-list:not(.sheets-list[data-ui-navigator-view="rows"]) > .panel__folder { display: contents; }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] .panel__folder .sheets-card {
    width: 100%;
  }


  /* Список уже имеет inset 10, тогда как общая папка рассчитана на полный
     контейнер панели. Выносим её рамку на 5 наружу: после border 1 и padding 4
     внутренняя строка снова имеет ту же ширину, что и штамп вне папки. */
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] > .panel__folder {
    margin-left: -5px;
    margin-right: -5px;
  }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] > .folder__tab {
    margin-left: 5px;
    /* Ритм папки в строках — тот же, что у канвасов: 8 перед ярлыком,
       закладка прилегает к рамке, 8 после рамки. Flex-gap списка (2)
       участвует в сумме, поэтому маргины даются с его учётом. */
    margin-top: 6px; /* 6 + gap 2 = 8 */
  }


  /* Папка первой в списке: от разделителя до ярлыка те же 12, что и у
     первой строки; верхний паддинг списка 12 уже даёт их — маргин ярлыка
     обнуляется. */
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] > .folder__tab:first-child { margin-top: 0; }


  /* Тот же закон у канвасов: их список без верхнего паддинга, отступ несёт
     сам элемент — ярлыку после разделителя даётся 12, как первой строке. */
[data-ui-surface="navigator"] .panel__hr + .folder__tab { margin-top: 12px; }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] > .folder__tab + .panel__folder {
    margin-top: -2px; /* gap 2 − 2 = 0: закладка сидит на рамке */
  }
[data-ui-surface="navigator"] .sheets-list[data-ui-navigator-view="rows"] > .panel__folder + .sheets-card {
    margin-top: 6px; /* 6 + gap 2 = 8 после рамки */
  }


  /* ============ ПАНЕЛЬ БЛОКОВ: перенос left-panel--blocks ============
     Оригинал: сетка 2 колонки, рамка h92 r6, счётчик 16×14 в углу,
     подпись «имя 12/500 + габариты 10», зазоры 22/8. */
[data-ui-surface="navigator"] .blocks-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 22px;
    column-gap: var(--arhix-space-gap);
    padding: var(--arhix-space-block) var(--arhix-space-inset) var(--arhix-space-inset);
    overflow: auto;
  }
[data-ui-surface="navigator"] .block-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    gap: 8px;
    min-width: 0;
    cursor: grab;
    outline: 0;
    user-select: none;
    -webkit-user-select: none;
  }
[data-ui-surface="navigator"] .block-card__frame {
    position: relative;
    height: 92px;
    border-radius: var(--arhix-radius-pill);
    border: 2px solid transparent;
    background: var(--arhix-surface);
    box-sizing: border-box;
    transition: border-color var(--arhix-motion-quick) ease;
  }
[data-ui-surface="navigator"] [data-ui-hatch-pattern-card] .block-card__frame {
    overflow: hidden;
    border-color: var(--arhix-line);
    background: var(--arhix-drawing-preview-bg);
  }
[data-ui-surface="navigator"] .block-card.is-selected .block-card__frame,
[data-ui-surface="navigator"] [data-ui-hatch-pattern-card][aria-selected="true"] .block-card__frame { border-color: var(--arhix-accent); }
[data-ui-surface="navigator"] .block-card:focus-visible .block-card__frame { border-color: var(--arhix-accent); }
[data-ui-surface="navigator"] .block-card [contenteditable="true"] {
    user-select: text;
    -webkit-user-select: text;
  }

  /* Номер места. Раньше здесь стоял счётчик применений, но он ничего не
     сообщает при взгляде на сетку, а номер сообщает сразу. Форма прежняя —
     компактный бейдж почти квадратом для одной цифры, растёт от содержимого. */
[data-ui-surface="navigator"] .block-card__index,
[data-ui-surface="navigator"] .sheets-card__index--badge,
[data-ui-surface="navigator"] .item__index {
    min-width: 16px;
    width: fit-content;
    height: 16px;
    padding: 0 3px;
    border-radius: var(--arhix-radius-chip);
    background: var(--arhix-surface-raised); /* белый, как в программе */
    border: 1px solid var(--arhix-line);     /* стандартная волосяная обводка */
    color: var(--arhix-ink-muted);
    font-family: var(--arhix-font);
    font-size: var(--arhix-font-size-small);
    font-weight: var(--arhix-font-weight-chrome);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
  }
[data-ui-surface="navigator"] .block-card__index {
    position: absolute;
    top: 4px;
    left: 4px;
    z-index: 1; /* номер всегда поверх SVG, включая плотные штриховки */
  }
[data-ui-surface="navigator"] .sheets-card__index--badge,
[data-ui-surface="navigator"] .item__index {
    align-self: center;
    background: var(--arhix-surface);
    border: 0;
  }
[data-ui-surface="navigator"] .sheets-card__index--badge {
    margin-right: var(--arhix-space-gap);
  }
[data-ui-surface="navigator"] [data-ui-document-publication] .sheets-card__index--badge {
    padding: 0 6px;
    letter-spacing: 0.4px;
  }
[data-ui-surface="navigator"] .block-card__caption {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 2px;
    min-width: 0;
    font-family: var(--arhix-font);
  }
[data-ui-surface="navigator"] .block-card__name {
    font-size: var(--arhix-font-size-body);
    font-weight: var(--arhix-font-weight-body);
    color: var(--arhix-ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
[data-ui-surface="navigator"] .block-card__dim {
    font-size: var(--arhix-font-size-small);
    color: var(--arhix-ink-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }