/* ===== T18: плашки магазинов «Цены → Товары» (shops.js): сетка 2 колонки квадратов, плашки сплошные (--solid), без стекла ===== */
.chips:empty { display: none; }
.shgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
/* T18c (дизайнер 08.11): квадрат строго 1/1 — высота только из ширины (contain: size: содержимое плашку не растит), каркас один у всех:
   метка 20 → число 40 → «товаров» 15 → полоса на одной высоте от верха → строки статуса сверху вниз, лишнее место — воздух снизу. */
.shgrid { align-items: start; }
.shp { position: relative; display: flex; flex-direction: column; justify-content: flex-start; gap: 0; aspect-ratio: 1 / 1; height: auto; min-width: 0; min-height: 0; contain: size; padding: 12px 14px; box-sizing: border-box; overflow: hidden;
  border-radius: var(--r-card); background: var(--solid); box-shadow: var(--tileEdge); color: var(--ink); text-decoration: none; transition: transform 120ms var(--ease); }
.shp:active { transform: scale(.97); }
.shp.wide { grid-column: 1 / -1; aspect-ratio: auto; height: 84px; flex-direction: row; align-items: center; gap: 16px; padding: 14px 16px; }
.shp.wide .shtop { flex: 0 0 auto; gap: 2px; }
.shp.wide .shn { font-size: 32px; line-height: 32px; }
.shp.wide .shu { display: none; }
.shp.wide .shlow { flex: 1 1 0; margin-top: 0; }
.shtag { display: flex; align-items: center; flex: none; height: 20px; font-size: 13px; font-weight: 500; color: var(--ink2); }
.shtag .ctag { display: inline-flex; align-items: center; gap: 6px; }
.shtop { display: flex; flex-direction: column; gap: 4px; flex: none; min-width: 0; }
.shmid { display: flex; flex-direction: column; gap: 0; }
.shn { font-size: 40px; font-weight: 300; letter-spacing: -.03em; line-height: 40px; white-space: nowrap; }
.shu { font-size: 12px; line-height: 15px; color: var(--ink2); }
.shlow { display: flex; flex-direction: column; gap: 8px; flex: none; margin-top: 8px; min-width: 0; }
.shbar { display: flex; flex: none; gap: 2px; height: 6px; }
.shs { display: block; height: 6px; border-radius: 3px; min-width: 3px; transform-origin: 0 50%; }
.shs-good { background: var(--good); } .shs-off { background: var(--off); } .shs-none { background: var(--ink3); }
.shs-unread { background: var(--ink3); opacity: .45; }
.shline { display: flex; flex-direction: column; gap: 2px; font-size: 12px; line-height: 15px; color: var(--ink2); }
.sht { display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.shd { flex: none; width: 6px; height: 6px; border-radius: 3px; background: var(--ink3); }
.shd-good { background: var(--good); } .shd-off { background: var(--off); } .shd-none { background: var(--ink3); }
.shback { margin-top: 14px; }
@media (prefers-reduced-motion: reduce) { .shp { transition: none; } .shp:active { transform: none; } }
