.hzCompareBar {
  position: sticky;
  bottom: 16px;
  z-index: 20;
  margin: 24px auto 0;
  width: min(100% - 32px, 1180px);
}

.hzCompareBar__in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid var(--hz-border);
  border-radius: 18px;
  background: var(--hz-surface);
  box-shadow: 0 12px 34px rgb(16 24 40 / 14%);
}

.hzCompareBar__copy { display: grid; gap: 2px; }
.hzCompareBar__title { font-weight: 800; }
.hzCompareBar__status { color: var(--hz-muted); font-size: 13px; }
.hzCompareBar__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.hzCompareBar button[disabled] { cursor: not-allowed; opacity: .45; }

.hzCatalogCompare {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) repeat(3, minmax(190px, 1fr));
  min-width: 760px;
  border: 1px solid var(--hz-border);
  border-radius: 16px;
  overflow: hidden;
}

.hzCatalogCompare__scroll { overflow-x: auto; }
.hzCatalogCompare__cell { min-height: 52px; padding: 12px; border-right: 1px solid var(--hz-border); border-bottom: 1px solid var(--hz-border); }
.hzCatalogCompare__cell:nth-child(4n) { border-right: 0; }
.hzCatalogCompare__cell:nth-last-child(-n + 4) { border-bottom: 0; }
.hzCatalogCompare__label { color: var(--hz-muted); font-size: 13px; font-weight: 700; }
.hzCatalogCompare__head { background: var(--hz-bg); font-weight: 800; }
.hzCatalogCompare__empty { color: var(--hz-muted); }
.hzCatalogSelect { width: 100%; margin-top: 10px; }

@media (max-width: 640px) {
  .hzCompareBar { bottom: 8px; width: calc(100% - 24px); }
  .hzCompareBar__in { align-items: stretch; flex-direction: column; }
  .hzCompareBar__actions { display: grid; grid-template-columns: 1fr 1fr; }
  .hzCompareBar__actions .hzPillBtn { justify-content: center; }
}