/* Мобильная вёрстка (≤768px). Десктоп не затрагивается. */

@media (max-width: 768px) {
  body.is-mobile #app-view.shell {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    padding-top: 0.35rem;
    padding-bottom: calc(4.25rem + env(safe-area-inset-bottom, 0px));
  }

  body.is-mobile #app-view.shell {
    padding-top: 3.35rem;
  }

  body.is-mobile.mobile-list-active.mobile-bulk-active #app-view.shell {
    padding-top: 6.55rem;
  }

  body.is-mobile .app-rail,
  body.is-mobile .app-rail-right,
  body.is-mobile .app-rail-bottom {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    opacity: 0;
    pointer-events: none;
  }

  body.is-mobile .app-header {
    padding-top: 0;
    margin-bottom: 0.65rem;
  }

  body.is-mobile .app-header h1 {
    font-size: 1.05rem;
    text-align: center;
  }

  body.is-mobile.mobile-collections-active .collections-page-card .collections-browse {
    margin-top: 1.15rem;
  }

  /* Перетаскивание порядка — только на десктопе */
  body.is-mobile .coll-sort-btn,
  body.is-mobile .coll-sort-toggle {
    display: none !important;
  }

  body.is-mobile .fields-drag-handle,
  body.is-mobile .fields-col-order,
  body.is-mobile .fields-cell-order {
    display: none !important;
  }

  body.is-mobile .fields-table--form .fields-col-order {
    display: none !important;
  }

  body.is-mobile #list-filters-desktop-slot {
    display: none;
  }

  body.is-mobile #list-search-toolbar:empty {
    display: none;
    margin: 0;
  }

  body.is-mobile .list-display-toolbar {
    margin-bottom: 0.5rem;
    gap: 0.5rem;
  }

  body.is-mobile .list-display-toolbar .list-view-toggle {
    display: none;
  }

  body.is-mobile .coll-category-toolbar .coll-items-sort-field {
    flex: 1 1 100%;
    max-width: none;
  }

  body.is-mobile .coll-category-toolbar .coll-items-sort-field .select-control {
    width: 100%;
    max-width: none;
  }

  body.is-mobile .coll-items-list-toolbar__start .coll-items-sort-field {
    flex: 1 1 100%;
    max-width: none;
  }

  body.is-mobile .coll-items-list-toolbar__start .coll-items-sort-field .select-control {
    width: 100%;
    max-width: none;
  }

  /* —— Верхняя панель —— */
  .mobile-top-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 320;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.65rem;
    padding-top: max(0.45rem, env(safe-area-inset-top, 0px));
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  body.is-mobile #mobile-top-bar {
    display: flex !important;
  }

  .mobile-top-bar[hidden] {
    display: none !important;
  }

  .mobile-top-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--text);
    cursor: pointer;
    box-shadow: var(--shadow);
  }

  .mobile-top-btn svg {
    width: 1.25rem;
    height: 1.25rem;
  }

  .mobile-top-bar {
    display: flex;
    align-items: center;
    gap: 0.45rem;
  }

  .mobile-top-bar #mobile-top-home-slot {
    order: 1;
    flex-shrink: 0;
  }

  .mobile-top-bar #mobile-top-search-slot {
    order: 2;
    flex: 1;
    min-width: 0;
  }

  .mobile-top-bar #mobile-menu-open {
    order: 3;
    flex-shrink: 0;
  }

  .mobile-top-home-slot {
    flex-shrink: 0;
  }

  .mobile-top-home-slot .btn-rail {
    position: static;
    clip: auto;
    width: auto;
    height: auto;
    margin: 0;
    opacity: 1;
    pointer-events: auto;
    overflow: visible;
  }

  .mobile-top-home-slot #home-btn.btn-icon-expand {
    max-width: 2.5rem;
    min-width: 2.5rem;
    min-height: 2.5rem;
    padding: 0;
    justify-content: center;
  }

  .mobile-top-home-slot #home-btn .btn-icon-expand__label {
    display: none;
  }

  .mobile-top-search-slot {
    flex: 1;
    min-width: 0;
  }

  .mobile-top-search-slot.hidden {
    display: none !important;
  }

  /* Страницы без поиска: бургер закреплён справа вверху */
  body.is-mobile.mobile-top-no-search .mobile-top-bar {
    justify-content: flex-start;
    background: transparent;
    border-bottom: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    pointer-events: none;
  }

  body.is-mobile.mobile-top-no-search .mobile-top-home-slot,
  body.is-mobile.mobile-top-no-search #mobile-menu-open {
    pointer-events: auto;
  }

  body.is-mobile.mobile-top-no-search .mobile-top-bar #mobile-top-home-slot {
    position: fixed;
    top: max(0.45rem, env(safe-area-inset-top, 0px));
    left: 0.65rem;
    right: auto;
    z-index: 325;
  }

  body.is-mobile.mobile-top-no-search .mobile-top-bar #mobile-menu-open {
    position: fixed;
    top: max(0.45rem, env(safe-area-inset-top, 0px));
    right: 0.65rem;
    left: auto;
    z-index: 325;
    margin-left: 0;
  }

  .mobile-top-search-slot #search-input,
  .mobile-top-search-slot #collections-browse-search {
    width: 100%;
    min-height: 2.5rem;
    margin: 0;
  }

  /* —— Панель массовых действий —— */
  .mobile-bulk-bar {
    position: fixed;
    top: calc(3.55rem + env(safe-area-inset-top, 0px));
    left: 0;
    right: 0;
    z-index: 315;
    padding: 0.28rem 0.45rem;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
  }

  .mobile-bulk-bar[hidden] {
    display: none !important;
  }

  body.is-mobile .mobile-bulk-bar:not(.has-selection) {
    display: none !important;
  }

  body.is-mobile .mobile-bulk-bar.has-selection {
    display: block !important;
  }

  .mobile-bulk-slot {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.3rem;
    width: 100%;
    min-width: 0;
  }

  .mobile-bulk-slot .btn {
    flex: 1 1 0;
    min-width: 0;
    min-height: 2rem;
    height: 2rem;
    margin: 0;
    padding: 0 0.45rem;
    font-size: 0.76rem;
    font-weight: 600;
    line-height: 1.15;
    border-radius: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: none;
  }

  .mobile-bulk-slot .btn.hidden {
    display: none !important;
  }

  .mobile-bulk-slot .btn-icon-expand {
    flex: 1 1 0;
    min-width: 2.5rem;
    max-width: 2.5rem;
  }

  .mobile-bulk-slot #bulk-add-to-collection-btn {
    background: color-mix(in srgb, var(--accent) 10%, var(--surface));
    color: var(--accent);
    border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--border));
  }

  .mobile-bulk-slot #bulk-collection-btn {
    background: color-mix(in srgb, var(--accent) 14%, var(--surface));
    color: var(--accent);
    border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border));
  }

  .mobile-bulk-slot #bulk-collection-btn[data-action="remove"] {
    background: color-mix(in srgb, var(--muted) 10%, var(--surface));
    color: var(--text);
    border: 1px solid var(--border);
  }

  .mobile-bulk-slot #bulk-delete-btn {
    background: var(--danger, #b33a3a);
    color: #fff;
    border: 1px solid color-mix(in srgb, var(--danger, #b33a3a) 85%, #000);
  }

  .mobile-bulk-slot #bulk-delete-btn:hover,
  .mobile-bulk-slot #bulk-delete-btn:focus-visible {
    background: color-mix(in srgb, var(--danger, #b33a3a) 86%, #000);
    color: #fff;
    border-color: color-mix(in srgb, var(--danger, #b33a3a) 85%, #000);
  }

  body.is-mobile.mobile-bulk-active .mobile-bulk-slot .btn-icon-expand,
  body.is-mobile.mobile-bulk-active .mobile-bulk-slot .btn-icon-expand:focus-visible {
    flex: 1 1 0;
    max-width: none;
    gap: 0.35rem;
    justify-content: center;
    overflow: hidden;
  }

  body.is-mobile.mobile-bulk-active .mobile-bulk-slot .btn-icon-expand__label {
    max-width: 9rem;
    opacity: 1;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.is-mobile.mobile-bulk-active .mobile-bulk-slot #bulk-delete-btn {
    flex: 1.2 1 0;
    min-width: 0;
  }

  body.is-mobile.mobile-bulk-active .mobile-bulk-slot #bulk-delete-btn .btn-rail-icon {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
  }

  /* —— Нижний навбар —— */
  .mobile-bottom-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 330;
    display: flex;
    align-items: stretch;
    gap: 0;
    padding: 0.35rem 0.5rem;
    padding-bottom: max(0.35rem, env(safe-area-inset-bottom, 0px));
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border-top: 1px solid var(--border);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.06);
  }

  body.is-mobile #mobile-bottom-nav {
    display: flex !important;
  }

  .mobile-bottom-nav[hidden] {
    display: none !important;
  }

  .mobile-bottom-nav-inner {
    flex: 1;
    display: flex;
    align-items: stretch;
    justify-content: space-around;
    gap: 0.2rem;
    min-width: 0;
  }

  .mobile-bottom-nav-inner #back-to-list-btn:not(.hidden) {
    order: -1;
  }

  .mobile-bottom-nav-inner > .btn-rail,
  .mobile-bottom-nav-inner > .settings-menu {
    position: static;
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
    width: 100%;
    height: auto;
    margin: 0;
    clip: auto;
    opacity: 1;
    pointer-events: auto;
    overflow: visible;
  }

  body.is-mobile .mobile-bottom-nav-inner > .settings-menu {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    min-width: 2.85rem;
  }

  .mobile-bottom-nav-inner .btn-rail,
  .mobile-bottom-nav-inner .settings-menu > .settings-menu-trigger {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    width: 100%;
    min-width: 0;
    min-height: 3rem;
    padding: 0.35rem 0.2rem;
    border-radius: var(--radius);
    border: none;
    box-shadow: none;
    background: transparent;
    max-width: none;
    list-style: none;
  }

  body.is-mobile .mobile-bottom-nav-inner .settings-menu > .settings-menu-trigger {
    flex: 1 1 auto;
    box-sizing: border-box;
  }

  .mobile-bottom-nav-inner .btn-icon-expand__label {
    display: block;
    width: 100%;
    max-width: 100%;
    opacity: 1;
    font-size: 0.62rem;
    line-height: 1.15;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.is-mobile .mobile-bottom-nav-inner .settings-menu .btn-icon-expand__label {
    padding: 0 0.1rem;
  }

  /* Не наследовать десктопный btn-ghost:focus (белый текст на прозрачном фоне) */
  body.is-mobile .mobile-bottom-nav-inner .btn-rail.btn-ghost,
  body.is-mobile .mobile-bottom-nav-inner .settings-menu > .settings-menu-trigger {
    color: var(--text);
    border: none;
  }

  body.is-mobile .mobile-bottom-nav-inner .btn-rail.btn-ghost:hover,
  body.is-mobile .mobile-bottom-nav-inner .btn-rail.btn-ghost:focus-visible,
  body.is-mobile .mobile-bottom-nav-inner .settings-menu > .settings-menu-trigger:hover,
  body.is-mobile .mobile-bottom-nav-inner .settings-menu > .settings-menu-trigger:focus-visible {
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    color: var(--text);
    border: none;
    box-shadow: none;
  }

  body.is-mobile .mobile-bottom-nav-inner .settings-menu[open] > .settings-menu-trigger {
    background: color-mix(in srgb, var(--accent) 16%, transparent);
    color: var(--text);
    border: none;
    box-shadow: none;
  }

  body.is-mobile .mobile-bottom-nav-inner .btn-rail.btn-ghost .btn-icon-expand__label,
  body.is-mobile .mobile-bottom-nav-inner .settings-menu > .settings-menu-trigger .btn-icon-expand__label {
    color: var(--text);
    opacity: 1;
  }

  body.is-mobile .mobile-bottom-nav-inner .btn-rail-icon,
  body.is-mobile .mobile-bottom-nav-inner .settings-menu .btn-rail-icon,
  body.is-mobile .mobile-bottom-nav-inner .theme-toggle-icons,
  body.is-mobile .mobile-bottom-nav-inner .theme-toggle-icons .theme-icon {
    color: var(--text);
    stroke: currentColor;
  }

  .mobile-bottom-nav-inner .btn-rail-icon,
  .mobile-bottom-nav-inner .theme-toggle-icons {
    width: 1.2rem;
    height: 1.2rem;
  }

  body.is-mobile .stats-card__head .stats-charts-toggle {
    display: none !important;
  }

  body.is-mobile .mobile-bottom-nav-inner .stats-charts-toggle.is-active {
    background: var(--accent);
    color: #fff;
  }

  body.is-mobile .mobile-bottom-nav-inner .stats-charts-toggle.is-active .btn-rail-icon,
  body.is-mobile .mobile-bottom-nav-inner .stats-charts-toggle.is-active .btn-icon-expand__label {
    color: #fff;
  }

  .mobile-bottom-nav-view {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding-left: 0.25rem;
    border-left: 1px solid var(--border);
  }

  .mobile-bottom-nav-view.hidden {
    display: none !important;
  }

  .mobile-bottom-nav-view .list-view-toggle {
    margin: 0;
    border-radius: var(--radius);
  }

  .mobile-bottom-nav-view .list-view-btn {
    width: 2.35rem;
    height: 2.35rem;
  }

  body.is-mobile .mobile-bottom-nav-view .list-view-btn.is-active {
    background: var(--accent);
    color: #fff;
  }

  body.is-mobile .mobile-bottom-nav-view .list-view-btn.is-active svg {
    stroke: currentColor;
  }

  body.is-mobile #pin-rail-btn,
  body.is-mobile #pin-rail-btn + .settings-menu-divider {
    display: none !important;
  }

  body.is-mobile .settings-menu-panel {
    position: fixed;
    left: 0.5rem;
    right: 0.5rem;
    bottom: calc(3.85rem + env(safe-area-inset-bottom, 0px));
    top: auto;
    min-width: 0;
    max-height: min(52vh, 22rem);
    overflow-y: auto;
    z-index: 400;
    box-shadow: var(--shadow), 0 8px 32px rgba(0, 0, 0, 0.12);
  }

  body.is-mobile.mobile-menu-open .settings-menu-panel {
    z-index: 250;
  }

  /* —— Бургер-меню —— */
  body.is-mobile #mobile-menu {
    display: block !important;
    position: fixed;
    inset: 0;
    z-index: 500;
    transition: visibility 0.2s ease;
  }

  body.is-mobile #mobile-menu:not(.is-open) {
    pointer-events: none;
    visibility: hidden;
  }

  body.is-mobile #mobile-menu.is-open {
    pointer-events: auto;
    visibility: visible;
  }

  body.is-mobile #mobile-menu[hidden] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .mobile-menu-backdrop {
    position: absolute;
    inset: 0;
    border: none;
    padding: 0;
    margin: 0;
    background: rgba(0, 0, 0, 0.45);
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.2s ease;
  }

  .mobile-menu.is-open .mobile-menu-backdrop {
    opacity: 1;
  }

  .mobile-menu-panel {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(20rem, 88vw);
    max-width: 100%;
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border-right: 1px solid var(--border);
    box-shadow: 8px 0 32px rgba(0, 0, 0, 0.12);
    transform: translateX(-102%);
    transition: transform 0.22s ease;
    overflow: hidden;
  }

  .mobile-menu.is-open .mobile-menu-panel {
    transform: translateX(0);
  }

  .mobile-menu-float {
    position: absolute;
    top: max(0.5rem, env(safe-area-inset-top, 0px));
    left: calc(min(20rem, 88vw) + 0.85rem);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
  }

  body.is-mobile #mobile-menu.is-open .mobile-menu-float {
    opacity: 1;
    pointer-events: auto;
  }

  .mobile-menu-close {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    margin: 0;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--surface) 70%, transparent);
    border-radius: var(--radius);
    background: var(--surface);
    color: var(--text);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    flex-shrink: 0;
  }

  .mobile-menu-close:hover {
    color: var(--danger);
    border-color: color-mix(in srgb, var(--danger) 40%, var(--border));
  }

  .mobile-menu-theme-slot {
    display: flex;
    justify-content: center;
    flex-shrink: 0;
  }

  .mobile-menu-theme-slot #theme-toggle.btn-icon-expand {
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    max-width: 2.75rem;
    padding: 0;
    margin: 0;
    justify-content: center;
    gap: 0;
    border: 1px solid color-mix(in srgb, var(--surface) 70%, transparent);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
  }

  .mobile-menu-theme-slot #theme-toggle .btn-icon-expand__label {
    display: none;
  }

  .mobile-menu-theme-slot #theme-toggle .theme-toggle-icons {
    width: 1.25rem;
    height: 1.25rem;
  }

  .mobile-menu-theme-slot #theme-toggle.btn-ghost:hover,
  .mobile-menu-theme-slot #theme-toggle.btn-ghost:focus-visible {
    background: var(--accent);
    color: #fff;
    border-color: var(--accent);
  }

  .mobile-menu-actions {
    padding: max(0.85rem, env(safe-area-inset-top, 0px)) 1rem 0.75rem;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
  }

  .mobile-menu-add-slot .btn-add {
    width: 100%;
    min-height: 2.75rem;
    justify-content: center;
    max-width: none;
    gap: 0.45rem;
  }

  .mobile-menu-add-slot .btn-icon-expand__label {
    max-width: none;
    opacity: 1;
  }

  .mobile-menu-filters {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem 1rem 1.25rem;
    -webkit-overflow-scrolling: touch;
  }

  .mobile-menu-filters.hidden {
    display: none !important;
  }

  .mobile-menu-filters .admin-filters {
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
    background: transparent;
  }

  .mobile-menu-filters .filters-details > summary {
    display: list-item;
    font-weight: 600;
    margin-bottom: 0.5rem;
  }

  .mobile-menu-filters .filters-grid--primary,
  .mobile-menu-filters .filters-grid--extra {
    grid-template-columns: 1fr;
  }

  .mobile-menu-filters .filter-field[style*="grid-column"] {
    grid-column: auto !important;
  }

  /* —— Карточки —— */
  body.is-mobile .items-cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  body.is-mobile .coll-items-cards-wrap .items-cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.is-mobile .coll-items-cards-wrap .item-card-field[data-col="country"] .item-card-value {
    max-width: 9.5ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.is-mobile .list-card {
    padding: 0.55rem;
  }

  /* Блок «Выбрать все» + сортировка (карточки и таблица на мобилке) */
  .list-table-mobile-head {
    display: none;
  }

  body.is-mobile .list-table-mobile-head:not(.hidden) {
    display: block;
    margin-bottom: 0.5rem;
  }

  body.is-mobile .list-table-mobile-head .list-select-all {
    display: inline-flex;
    margin: 0 0 0.4rem;
    font-size: 0.85rem;
  }

  body.is-mobile .items-cards-sort,
  body.is-mobile .list-table-mobile-head .items-cards-sort {
    margin-bottom: 0.45rem;
    padding: 0.3rem 0.4rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  body.is-mobile .items-cards-sort-row,
  body.is-mobile .list-table-mobile-head .items-cards-sort-row {
    flex-wrap: nowrap;
    gap: 0.5rem;
    width: max-content;
    min-width: 100%;
  }

  body.is-mobile .item-card {
    border-radius: calc(var(--radius) - 2px);
  }

  body.is-mobile .item-card-body {
    padding: 0.4rem 0.45rem 0.45rem;
    gap: 0.2rem;
  }

  body.is-mobile .item-card-field {
    font-size: 0.72rem;
    gap: 0.15rem;
  }

  body.is-mobile .item-card-label {
    font-size: 0.65rem;
  }

  body.is-mobile .item-card-field[data-col="title"] .item-card-value {
    font-size: 0.82rem;
    line-height: 1.25;
  }

  body.is-mobile .item-card-actions {
    flex-direction: column;
    align-items: center;
    padding: 0.35rem 0.4rem;
    gap: 0.2rem;
  }

  body.is-mobile .item-card-actions-btns {
    flex: none;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 0.1rem;
    min-width: 0;
  }

  body.is-mobile .item-card-actions .btn-icon {
    flex: 0 0 auto;
    width: clamp(26px, calc((100% - 0.3rem) / 4), 32px);
    height: clamp(26px, calc((100% - 0.3rem) / 4), 32px);
    min-height: clamp(26px, calc((100% - 0.3rem) / 4), 32px);
  }

  body.is-mobile .item-card-id {
    width: 100%;
    text-align: center;
    font-size: 0.65rem;
  }

  body.is-mobile .item-card-select {
    top: 0.3rem;
    left: 0.3rem;
  }

  /* —— Таблица (карточки-строки) —— */
  body.is-mobile .table-stack-mobile {
    border-spacing: 0 0.45rem;
  }

  body.is-mobile .table-stack-mobile tbody tr.stack-row.row-not-in-collection > td,
  body.is-mobile .table-stack-mobile tbody tr.stack-row.row-selected > td {
    background: transparent;
  }

  body.is-mobile .table-stack-mobile .stack-row.row-not-in-collection {
    background: color-mix(in srgb, var(--danger, #b33a3a) 7%, var(--surface));
    border-color: color-mix(in srgb, var(--danger, #b33a3a) 28%, var(--border));
  }

  body.is-mobile .table-stack-mobile .stack-row.row-not-in-collection .stack-clip--title {
    color: var(--danger, #b33a3a);
  }

  body.is-mobile .table-stack-mobile .stack-row.row-selected {
    border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent);
  }

  body.is-mobile .table-stack-mobile .stack-row {
    display: grid;
    grid-template-columns: 1.1rem 54px minmax(0, 1fr) minmax(3.5rem, auto);
    grid-template-rows: auto auto auto auto auto;
    column-gap: 0.45rem;
    row-gap: 0.1rem;
    align-items: start;
    padding: 0.45rem 0.5rem 0.4rem;
    border-radius: calc(var(--radius) - 1px);
  }

  body.is-mobile .table-stack-mobile .stack-row td {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 0;
    margin: 0;
    border-bottom: none;
    font-size: 0.75rem;
    order: unset;
  }

  body.is-mobile .table-stack-mobile .stack-row .stack-clip {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.is-mobile .table-stack-mobile .stack-row .col-select {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: start;
    padding-top: 0.15rem;
    justify-content: flex-start;
  }

  body.is-mobile .table-stack-mobile .stack-row .col-select::before {
    display: none;
  }

  body.is-mobile .table-stack-mobile .stack-row .col-thumb {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: start;
    justify-content: center;
  }

  body.is-mobile .table-stack-mobile .stack-row .col-thumb::before {
    display: none;
  }

  body.is-mobile .table-stack-mobile .stack-row .col-thumb .table-thumb-btn,
  body.is-mobile .table-stack-mobile .stack-row .col-thumb .table-thumb-frame {
    width: 54px;
    height: 54px;
  }

  body.is-mobile .table-stack-mobile .stack-row .col-thumb .table-thumb,
  body.is-mobile .table-stack-mobile .stack-row .col-thumb .table-thumb-stack {
    max-width: 54px;
    max-height: 54px;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-title {
    grid-column: 3;
    grid-row: 1;
    align-items: flex-start;
    align-self: start;
    justify-content: flex-start;
    text-align: left;
    overflow: hidden;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-title::before {
    display: none;
  }

  body.is-mobile .table-stack-mobile .stack-row .stack-clip--title {
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.28;
    max-width: 100%;
    white-space: normal;
    overflow: hidden;
    text-overflow: clip;
    overflow-wrap: break-word;
    word-break: break-word;
    hyphens: none;
    -webkit-hyphens: none;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-stack-sub {
    grid-column: 3;
    grid-row: 2;
    justify-content: flex-start;
    gap: 0.15rem;
    color: var(--muted);
    font-size: 0.72rem;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-stack-sub::before {
    content: "Номинал";
    flex-shrink: 0;
    font-weight: 500;
    color: var(--muted);
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-cost {
    grid-column: 4;
    grid-row: 1 / 3;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.05rem;
    text-align: right;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-cost::before {
    content: attr(data-label);
    font-size: 0.65rem;
    font-weight: 500;
    color: var(--muted);
    line-height: 1.2;
  }

  body.is-mobile .table-stack-mobile .stack-row .stack-clip--cost {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--accent);
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-stack-meta {
    grid-row: 3;
    flex-direction: row;
    justify-content: flex-start;
    gap: 0.2rem;
    font-size: 0.72rem;
    padding-top: 0.15rem;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-stack-meta::before {
    content: attr(data-label);
    flex-shrink: 0;
    font-weight: 500;
    color: var(--muted);
  }

  body.is-mobile .table-stack-mobile .stack-row td[data-col="type"].cell-stack-meta {
    grid-column: 3;
  }

  body.is-mobile .table-stack-mobile .stack-row td[data-col="country"].cell-stack-meta {
    grid-column: 4;
    max-width: 9.5ch;
    min-width: 0;
    overflow: hidden;
    flex: 0 1 auto;
  }

  body.is-mobile .table-stack-mobile .stack-row td[data-col="country"] .stack-clip,
  body.is-mobile .table-stack-mobile .stack-row .stack-clip--country {
    max-width: 9.5ch;
  }

  body.is-mobile .table-stack-mobile .stack-row td[data-col="type"].cell-stack-meta {
    min-width: 0;
    overflow: hidden;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-stack-sub .stack-clip {
    min-width: 0;
    max-width: 100%;
  }

  body.is-mobile .table-stack-mobile .stack-row td[data-col="type"].cell-stack-meta[hidden],
  body.is-mobile .table-stack-mobile .stack-row td[data-col="country"].cell-stack-meta[hidden] {
    display: none !important;
  }

  body.is-mobile .table-stack-mobile .stack-row:has(td[data-col="type"].cell-stack-meta[hidden]):not(:has(td[data-col="country"].cell-stack-meta[hidden])) td[data-col="country"].cell-stack-meta {
    grid-column: 3 / 5;
  }

  body.is-mobile .table-stack-mobile .stack-row:has(td[data-col="country"].cell-stack-meta[hidden]):not(:has(td[data-col="type"].cell-stack-meta[hidden])) td[data-col="type"].cell-stack-meta {
    grid-column: 3 / 5;
  }

  body.is-mobile .table-stack-mobile .stack-row:has(.cell-cost[hidden]) .cell-title,
  body.is-mobile .table-stack-mobile .stack-row:has(.cell-cost[hidden]) .cell-stack-sub {
    grid-column: 3 / 5;
  }

  body.is-mobile .table-stack-mobile .stack-row:has(.cell-stack-sub[hidden]) .cell-title {
    grid-row: 1 / 3;
    align-self: center;
  }

  body.is-mobile .table-stack-mobile .stack-row::before {
    content: "";
    grid-column: 1 / -1;
    grid-row: 4;
    height: 0;
    border-top: 1px solid var(--border);
    pointer-events: none;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-id {
    grid-column: 4;
    grid-row: 5;
    justify-content: flex-end;
    padding-top: 0.28rem;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-id::before {
    display: none;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-id-inner {
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 0.15rem;
    margin: 0;
    margin-left: auto;
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-id-num {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--muted);
  }

  body.is-mobile .table-stack-mobile .stack-row .cell-id-num::before {
    content: "ID ";
    font-weight: 500;
  }

  body.is-mobile .table-stack-mobile .stack-row .btn-details-toggle svg {
    width: 11px;
    height: 11px;
  }

  body.is-mobile .table-stack-mobile .stack-row .row-actions {
    grid-column: 1 / 4;
    grid-row: 5;
    justify-content: flex-start;
    padding-top: 0.2rem;
    gap: 0.2rem;
  }

  body.is-mobile .table-stack-mobile .stack-row .row-actions::before {
    display: none;
  }

  body.is-mobile .table-stack-mobile .stack-row .row-actions .btn-icon {
    width: 32px;
    height: 32px;
    min-height: 32px;
    border-radius: 8px;
  }

  body.is-mobile .table-stack-mobile .stack-row .row-actions .btn-icon svg {
    width: 16px;
    height: 16px;
  }

  body.is-mobile .table-stack-mobile tr.row-details {
    display: none !important;
  }

  /* —— Модалки поверх мобильного хрома —— */
  body.is-mobile .preview-image-zoom {
    z-index: 650;
  }

  body.is-mobile .modal-backdrop {
    z-index: 600;
    align-items: flex-start;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Алерты/подтверждения — по центру видимой области, не под верхней панелью */
  body.is-mobile #app-dialog.modal-backdrop,
  body.is-mobile #app-loading.modal-backdrop {
    align-items: center;
    justify-content: center;
    padding: calc(3.35rem + env(safe-area-inset-top, 0px)) 1rem
      calc(4.25rem + env(safe-area-inset-bottom, 0px));
  }

  body.is-mobile.mobile-bulk-active #app-dialog.modal-backdrop,
  body.is-mobile.mobile-bulk-active #app-loading.modal-backdrop {
    padding-top: calc(6.2rem + env(safe-area-inset-top, 0px));
  }

  body.is-mobile #app-dialog .app-dialog-modal,
  body.is-mobile #app-loading .app-loading-modal {
    margin: auto;
    flex-shrink: 0;
    max-height: min(
      90dvh,
      calc(
        100dvh - 7.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)
      )
    );
  }

  body.is-mobile.mobile-bulk-active #app-dialog .app-dialog-modal,
  body.is-mobile.mobile-bulk-active #app-loading .app-loading-modal {
    max-height: min(
      85dvh,
      calc(
        100dvh - 10.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)
      )
    );
  }

  /* У crop тоже класс modal-backdrop — правило ниже и специфичнее */
  body.is-mobile .modal-backdrop.image-crop-backdrop {
    z-index: 700;
    align-items: center;
    overflow: hidden;
  }

  body.is-mobile .image-crop-modal {
    width: min(100%, 96vw);
    max-height: calc(100dvh - 1.5rem);
    overflow-y: auto;
  }

  body.is-mobile .image-crop-stage-wrap {
    max-height: min(38dvh, 340px);
    width: 100%;
    overflow: hidden;
  }

  body.is-mobile .image-crop-stage {
    max-width: 100%;
    margin-inline: auto;
  }

  body.is-mobile {
    --mobile-bottom-nav-slot: 4.75rem;
    --mobile-bottom-nav-overlap: calc(var(--mobile-bottom-nav-slot) * 0.7);
    --mobile-bottom-nav-clearance: calc(var(--mobile-bottom-nav-slot) * 0.3);
  }

  body.is-mobile .item-preview-backdrop {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    overflow: hidden;
    padding: 0 0.5rem 0.85rem;
    padding-top: calc(3.15rem + env(safe-area-inset-top, 0px));
    padding-bottom: calc(var(--mobile-bottom-nav-clearance) + env(safe-area-inset-bottom, 0px));
  }

  body.is-mobile .item-preview-dialog {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    margin: 0;
    width: 100%;
    max-height: none;
    overflow: visible;
  }

  body.is-mobile .item-preview-modal {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    height: auto;
    padding: 0;
    overflow: visible;
  }

  body.is-mobile .item-preview-layout {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow: hidden;
  }

  body.is-mobile .item-preview-media {
    order: -1;
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    align-items: stretch;
    margin: 0;
    padding: 0;
    overflow: hidden;
  }

  body.is-mobile .item-preview-media .img-carousel,
  body.is-mobile .item-preview-media .img-carousel--modal {
    width: 100%;
    max-width: 100%;
    align-items: stretch;
  }

  body.is-mobile .item-preview-media .img-carousel--modal .img-carousel-stage,
  body.is-mobile .item-preview-media .img-carousel--modal.img-carousel--empty {
    width: 100%;
    max-width: 100%;
    height: min(calc(38vh * 1.25), 325px);
    max-height: min(calc(38vh * 1.25), 325px);
    flex: 0 0 auto;
    border-radius: var(--radius) var(--radius) 0 0;
    border-left: none;
    border-right: none;
    border-top: none;
  }

  body.is-mobile .item-preview-media .img-carousel--modal .img-carousel-img {
    width: auto;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
  }

  body.is-mobile .item-preview-media .img-carousel--modal:not(.img-carousel--empty) .img-carousel-img {
    -webkit-tap-highlight-color: transparent;
  }

  body.is-mobile .item-preview-media .img-carousel--modal .img-carousel-stage {
    touch-action: pan-y pinch-zoom;
  }

  body.is-mobile .img-carousel-stage .img-carousel-img {
    will-change: transform;
  }

  body.is-mobile .item-card-media .img-carousel-stage .img-carousel-img {
    will-change: transform;
  }

  body.is-mobile .item-preview-layout {
    will-change: transform;
  }

  @media (prefers-reduced-motion: reduce) {
    body.is-mobile .img-carousel-stage .img-carousel-img,
    body.is-mobile .item-preview-layout {
      will-change: auto;
    }
  }

  body.is-mobile .item-preview-info {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    margin-bottom: calc(-1 * var(--mobile-bottom-nav-overlap));
    padding: 0.75rem 0.65rem 0;
    padding-bottom: calc(0.85rem + var(--mobile-bottom-nav-overlap) + env(safe-area-inset-bottom, 0px));
    background: var(--surface);
    border-radius: 0 0 var(--radius) var(--radius);
    box-shadow: 0 -8px 24px color-mix(in srgb, var(--text) 10%, transparent);
  }

  body.is-mobile .item-preview-heading {
    flex-shrink: 0;
    margin-bottom: 0.5rem;
  }

  body.is-mobile .item-preview-details {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    margin-bottom: 0;
  }

  body.is-mobile .item-preview-nav {
    display: none !important;
  }

  body.is-mobile .item-preview-props {
    gap: 0.65rem;
  }

  body.is-mobile .item-preview-specs--grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem 0.55rem;
  }

  body.is-mobile .item-preview-spec {
    padding: 0.45rem 0.5rem;
  }

  body.is-mobile .item-preview-hero {
    padding: 0.6rem 0.7rem;
    gap: 0.5rem 0.65rem;
  }

  body.is-mobile .item-preview-hero__nominal {
    font-size: 0.92rem;
    line-height: 1.3;
  }

  body.is-mobile .item-preview-hero__cost {
    font-size: 1.1rem;
  }

  body.is-mobile .item-preview-hero__price {
    min-width: 3.75rem;
  }

  body.is-mobile .item-preview-modal.item-preview--not-in-collection .item-preview-props {
    margin-left: -0.65rem;
    margin-right: -0.65rem;
    padding-left: 0.65rem;
    padding-right: 0.65rem;
    border-radius: 0;
    background: color-mix(in srgb, var(--danger, #b33a3a) 7%, var(--surface));
  }

  body.is-mobile .item-preview-toolbar {
    flex-shrink: 0;
    margin-top: 0;
    padding: 0.55rem 0 0;
    border-top: 1px solid var(--border);
    background: transparent;
    box-shadow: none;
  }

  body.is-mobile .item-preview-toolbar .item-preview-actions {
    padding: 0;
    border-top: none;
  }

  body.is-mobile .item-preview-close {
    position: fixed;
    top: calc(0.45rem + env(safe-area-inset-top, 0px));
    right: 0.5rem;
    z-index: 610;
  }

  body.is-mobile.mobile-bulk-active .item-preview-close {
    top: calc(3.65rem + env(safe-area-inset-top, 0px));
  }

  /* —— Форма предмета —— */
  body.is-mobile .form-view {
    max-width: none;
  }

  body.is-mobile .form-view-header {
    margin-bottom: 0.75rem;
    padding-bottom: 0.65rem;
  }

  body.is-mobile .form-view-header__title {
    font-size: 1.15rem;
  }

  body.is-mobile .item-form-layout {
    gap: 0.75rem;
  }

  body.is-mobile .item-form-main {
    gap: 0.75rem;
  }

  body.is-mobile .form-panel__header {
    padding: 0.55rem 0.75rem;
  }

  body.is-mobile .form-panel__body {
    padding: 0.75rem;
  }

  body.is-mobile .form-panel__body.form-grid {
    gap: 0.75rem;
  }

  body.is-mobile .item-form [data-field-key="title"] input {
    font-size: 1.05rem;
  }

  body.is-mobile .item-form .form-actions .btn {
    min-height: 44px;
  }

  body.is-mobile .coll-detail-hero {
    padding: 0.85rem;
  }

  body.is-mobile .coll-detail-hero--banner {
    min-height: 12rem;
    padding: 0;
  }

  body.is-mobile .coll-detail-hero--with-nav .coll-detail-hero__inner {
    padding-left: 1.65rem;
    padding-right: 1.65rem;
  }

  body.is-mobile .coll-detail-hero__nav {
    height: 1.25rem;
    min-width: 1.25rem;
    max-width: 1.25rem;
    top: auto;
    bottom: 0.45rem;
    transform: none;
  }

  body.is-mobile .coll-detail-hero__nav--prev {
    left: 0.3rem;
  }

  body.is-mobile .coll-detail-hero__nav--next {
    right: 0.3rem;
  }

  body.is-mobile .coll-detail-hero__nav .btn-icon-expand__label {
    display: none;
  }

  body.is-mobile .coll-detail-hero__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
    padding: 0.85rem;
  }

  body.is-mobile .coll-detail-hero__media {
    display: flex;
    justify-content: center;
  }

  body.is-mobile .coll-thumb--xl {
    width: 4.75rem;
    height: 4.75rem;
  }

  body.is-mobile .coll-detail-hero__title {
    font-size: 1.15rem;
    text-align: left;
  }

  body.is-mobile .coll-detail-hero__crumb {
    text-align: left;
  }

  body.is-mobile .coll-detail-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem;
  }

  body.is-mobile .coll-detail-hero__stat {
    padding: 0.4rem 0.5rem;
  }

  body.is-mobile .coll-detail-hero__stat dd {
    font-size: 0.82rem;
  }

  body.is-mobile .collections-page-header__actions #coll-browse-view-toggle {
    display: none;
  }

  body.is-mobile .coll-browse-search-row {
    flex-direction: column;
    gap: 0.65rem;
  }

  body.is-mobile .coll-browse-search-row__col {
    width: 100%;
    max-width: 9.5rem;
    flex: 0 0 auto;
  }

  body.is-mobile .coll-browse-search-item {
    width: 100%;
    min-width: 0;
  }

  body.is-mobile .collections-browse-settings-btn {
    max-width: 15rem;
    gap: 0.4rem;
    justify-content: flex-start;
  }

  body.is-mobile .collections-browse-settings-btn .btn-icon-expand__label {
    max-width: 10rem;
    opacity: 1;
  }

  body.is-mobile .quick-photo-camera-btn {
    display: inline-flex;
  }

  body.is-mobile .quick-photo-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 380px) {
  body.is-mobile .items-cards-grid {
    grid-template-columns: 1fr;
  }

  body.is-mobile .coll-items-cards-wrap .items-cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}