/* ---------- Конкуренты — воздух (05.11.2026; js/screens/competitors.js, AUDIT-B §2.4/§3.3 и уточнения дизайнера)
   Владелец: «не нравится мелкий текст, лучше графику, больше воздуха». Содержание от 14, вторичное 13, 12 — только капс.
   Строка товара: название 16/600 до 2 строк, справа «−86 ₽» 16/700 warn; ниже [WB] ИП и «у вас N ₽» 13 ink2; полоса
   конкурентов 6 px. Внизу свёрнутые «Без свежей цены: N» и «Нет в наличии: N». Магазины — свой раздел (T10), строка 56 px.
   Отдельный файл (как people.css): общие классы app.css правят другие порции. */

/* Шапка вкладки: «Конкуренты у N товаров» — 14, время — 13 (только на этом экране). */
.cmscr .hubhead .hc { font-size: var(--fs-14); color: var(--ink2); }
.cmscr .hubhead .fresh { font-size: var(--fs-13); }

/* Заметки (Ozon только по свежим ценам с Mac, «N не выравниваю», «Сравнить пока не с чем») — 14 ink2. */
.cmnote { margin: 12px 4px 0; font-size: var(--fs-14); line-height: 1.45; color: var(--ink2); }
.cmnote.t-warn { color: var(--warn); }

/* Легенда полосы — одна строка 13 ink2. */
.cmleg { margin: 16px 4px 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: var(--fs-13); color: var(--ink2); }
.cmleg span { display: inline-flex; align-items: center; gap: 6px; }
.cmleg i { width: 10px; height: 10px; border-radius: 3px; }

/* Сегменты: дешевле — warn, не дешевле — good, нет свежей цены — контур none (светлая тема: тёмные статусные, ≥3:1). */
.sg-warn { background: rgb(var(--rgbMkWarn)); }
.sg-good { background: rgb(var(--rgbMkGood)); }
.sg-none { background: transparent; box-shadow: inset 0 0 0 1.5px rgb(var(--rgbMkNone)); }

.cmlist { padding: 2px 16px; margin-top: 10px; }
.row.cmrow { min-height: 72px; padding: 14px 0; align-items: flex-start; color: inherit; text-decoration: none; }
.cmc { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.cm1 { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.cmnm { flex: 1 1 auto; min-width: 0; font-size: var(--fs-16); font-weight: 600; line-height: 1.3; color: var(--ink);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; overflow-wrap: normal; word-break: normal; }
.cmgap { flex: none; font-size: var(--fs-16); font-weight: 700; line-height: 1.3; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cm2 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: var(--fs-13); line-height: 1.35; color: var(--ink2); }
.cmcab { display: inline-flex; align-items: center; gap: 6px; }
.cmstrip { display: flex; gap: 3px; margin-top: 4px; }
.cmstrip i { flex: 1 1 0; max-width: 28px; height: 6px; border-radius: 3px; }
.cmstrip.share i { max-width: none; flex-basis: 0; }

/* Свёрнутые строки внизу списка (56 px) и их тело — раскрытие как в SPEC-EXPAND (grid-rows 0fr → 1fr). */
.cmfold { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 56px; padding: 0; border: 0; border-top: 1px solid var(--line);
  background: transparent; color: var(--ink); font: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.cmfold.first { border-top: 0; }
.cmf-t { font-size: var(--fs-16); font-weight: 600; }
.cmf-t b { font-weight: 700; color: var(--ink2); }
.cmfold .chev { margin-left: auto; display: flex; color: var(--muted); transition: transform 200ms ease; }
.cmfold[aria-expanded="true"] .chev { transform: rotate(180deg); }
.cmbody { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 200ms ease-out; }
.cmbody.open { grid-template-rows: 1fr; }
.cmbody[hidden] { display: none; }
.cmbin { min-height: 0; overflow: hidden; }
.cmwhy { margin: 0 0 4px; font-size: var(--fs-14); line-height: 1.45; color: var(--ink2); }
.cmbin .row.cmrow { border-top: 1px solid var(--line); }

/* T10 (06.11): разделы «Товары N / Магазины N» под шапкой — сегменты 44 px, не лайм (лайм — только у «Выровнять N»).
   Подложка s1 в тёмной, s2 в светлой, радиус 14, отступ 3; выбранный — радиус 11, s2 в тёмной, белый с тенью в светлой;
   текст 14/600 ink, невыбранный ink2. От шапки и до следующего блока — 16. Переключение мгновенное. */
.cmtabs { flex: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); height: 44px; margin-top: 16px; padding: 3px;
  border-radius: 14px; background: var(--surface); box-sizing: border-box; }
:root[data-theme="light"] .cmtabs { background: var(--surface2); }
.cmtab { min-width: 0; border: 0; border-radius: 11px; background: transparent; color: var(--ink2); font: 600 var(--fs-14) 'Manrope', sans-serif;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.cmtab[aria-selected="true"] { background: var(--sel); color: var(--onSel); }   /* выбор — фоном sel (чистка v7) */
:root[data-theme="light"] .cmtab[aria-selected="true"] { background: var(--sel); box-shadow: none; }
.cmtab:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.cmpanel > .chips { margin-top: 16px; }

/* Раздел «Магазины»: одна карточка, строка 56 px, имя 16/600 слева, справа одно значение 14/600; пусто — 14 ink2. */
.card.list.cmstores { margin-top: 16px; }
.cmempty-t { margin: 0; padding: 18px 0; font-size: var(--fs-14); line-height: 1.45; color: var(--ink2); }
.row.cmshop { min-height: 56px; padding: 0; gap: 12px; color: inherit; text-decoration: none; }
.cms-nm { flex: 1 1 auto; min-width: 0; font-size: var(--fs-16); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cms-v { flex: none; font-size: var(--fs-14); font-weight: 600; white-space: nowrap; }
.cms-v.t-muted { color: var(--ink2); }
.cms-chev { flex: none; display: flex; color: var(--muted); }

/* Экран конкурентов товара: статус 14/600 цветом тона, время справа 13 ink2. */
.cmrl { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 0 0 14px; margin-top: -6px; }
.cmrl-s { font-size: var(--fs-14); font-weight: 600; line-height: 1.4; }
.cmrl-t { flex: none; font-size: var(--fs-13); color: var(--ink2); white-space: nowrap; }

@media (prefers-reduced-motion: reduce) { .cmbody, .cmfold .chev { transition: none; } }

/* Экран конкурентов товара: одно время чтения под героем (ревью дизайнера 05.11, п. 6). */
.cmread { margin: 10px 4px 0; font-size: var(--fs-13); color: var(--ink2); }

/* «Сравнить пока не с чем» — ниже строка-ссылка «Состояние чтений ›» 52 px (владельцу и админам). */
.row.cmreads { justify-content: space-between; color: inherit; text-decoration: none; }
.cmreads-t { font-size: var(--fs-16); font-weight: 600; }