/* Телефон (до 700 px): категории и поиск одной строкой, таблицы сканера — квадратные карточки.
   Разметка ячеек (классы mc-*, подписи data-label) — mobile-cards.js. Планшеты и десктоп остаются с таблицей. */
@media (max-width: 700px) {
  /* Разделы и категории: одна прокручиваемая строка вместо нескольких рядов */
  .sub-tabs { overflow-x: auto; scrollbar-width: none; margin: 0 -14px; padding: 0 14px; }
  .sub-tabs::-webkit-scrollbar, #chips::-webkit-scrollbar { display: none; }
  .sub-tabs a { flex: none; white-space: nowrap; }
  .chips-row { flex-direction: column; align-items: stretch; gap: 10px; }
  .filters .search { order: -1; flex: 1 1 100%; width: 100%; height: 44px; margin: 0; padding: 0 14px; border-radius: 12px; }
  .filters .search input { font-size: 16px; }
  .chips-row { min-width: 0; }
  #chips { display: flex; flex: none; flex-wrap: nowrap; overflow-x: auto; gap: 8px; width: calc(100% + 28px); max-width: none; min-width: 0; margin: 0 -14px; padding: 2px 14px 6px; scrollbar-width: none; }
  #chips .chip { flex: none; height: 34px; padding: 0 14px; border-radius: 17px; white-space: nowrap; }
  .filters { gap: 10px 14px; align-items: center; }

  /* Таблица → карточки */
  #page-moex .table-card { overflow: visible; }
  #page-moex .pairs { display: block; width: 100%; min-width: 0 !important; border: 0; }
  #page-moex .pairs > thead { display: none; }
  #page-moex .pairs > tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 10px; }
  #page-moex .pairs > tbody > tr:not(.xp-row) {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 6px 10px;
    position: relative; min-width: 0; padding: 12px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2);
  }
  #page-moex .pairs > tbody > tr:not(.xp-row).group-row { grid-column: 1 / -1; background: var(--card); }
  #page-moex .pairs > tbody > tr:not(.xp-row).expanded { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td {
    display: none; min-width: 0 !important; width: auto !important; height: auto !important; padding: 0 !important; border: 0 !important;
    position: static !important; background: transparent !important; box-shadow: none !important; text-align: left;
  }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-star { display: block; position: absolute !important; top: 10px; right: 10px; left: auto !important; z-index: 1; font-size: 16px; }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-title { display: block; grid-column: 1 / -1; order: 1; padding-right: 24px !important; font-size: 13px; }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-sub { display: block; grid-column: 1 / -1; order: 2; font-size: 11px; color: var(--muted); }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-primary { display: block; grid-column: 1 / -1; order: 3; font-size: 22px; font-weight: 800; line-height: 1.15; }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-show { display: block; order: 4; font-size: 13px; font-weight: 600; }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-primary::before,
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-show::before { content: attr(data-label); display: block; margin-bottom: 1px; color: var(--muted); font-size: 10.5px; font-weight: 500; }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-status { display: block; order: 5; font-size: 11.5px; }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-action { display: block; grid-column: 1 / -1; order: 6; }
  #page-moex .pairs > tbody > tr:not(.xp-row) > td.mc-action .open-btn { width: 100%; justify-content: center; height: 32px; }
  #page-moex .pairs .pair-description { max-width: none; white-space: normal; }
  #page-moex .pairs .pair-stack-line { height: auto; flex-wrap: wrap; }
  #page-moex .pairs .pair-symbols-inline { flex-wrap: wrap; gap: 2px 6px; font-size: 13px; }
  #page-moex .pairs td.mc-title { padding-right: 30px !important; }
  #page-moex .pairs td.mc-status .trading-status { padding: 0; background: none; font-size: 11.5px; white-space: nowrap; }
  #page-moex .pairs td.mc-status { align-self: end; }
  #page-moex .pairs td.mc-title, #page-moex .pairs td.mc-title * { white-space: normal !important; overflow-wrap: anywhere; min-width: 0; max-width: 100%; }
  #page-moex .pairs td.mc-title { overflow: hidden; }
  #page-moex .pairs tr.group-row .cross-exchange-list { display: none; }
  /* Нажатая карточка скрывается: вместо неё раскрытая связка (закрытие — крестик в панели) */
  #page-moex .pairs > tbody > tr.expanded:not(.xp-row):not(.group-row) { display: none; }
  /* Раскрытая связка занимает всю ширину под карточками */
  #page-moex .pairs > tbody > tr.xp-row { grid-column: 1 / -1; display: block; }
  #page-moex .pairs > tbody > tr.xp-row > td { display: block; padding: 0; }
  #page-moex .table-foot { padding: 10px 14px; }
}
@media (max-width: 380px) {
  #page-moex .pairs > tbody { grid-template-columns: minmax(0, 1fr); }
}
