/*
 * Страница подбора. Значения — из tokens.css; здесь только правила и две переменные страницы:
 * чёрные кнопки-таблетки и белое поле. Страница живёт отдельно от style.css: у неё своя сетка
 * на весь экран, и общие правила каталога ей только мешали бы.
 */

:root {
  --pb-bg: var(--c-surface);
  --pb-rail: var(--c-bg);
  --pb-ink: var(--c-text);
  --pb-on-ink: var(--c-surface);
  --pb-line: var(--c-separator);
  --pb-rail-w: 260px;
  --pb-col: 760px;
  --pb-panel-w: min(720px, 100vw);
}

*, *::before, *::after { box-sizing: border-box; }

html, body { height: 100%; }
/* Страница целиком не прокручивается: только лента и панели. */
html { overflow: hidden; }

body.pb {
  margin: 0;
  display: grid;
  grid-template-columns: var(--pb-rail-w) minmax(0, 1fr);
  height: 100dvh;
  overflow: hidden;
  background: var(--pb-bg);
  color: var(--c-text);
  font: var(--fw-regular) var(--fs-body) / var(--lh-body) var(--font-ui);
}

a { color: inherit; }

button { font: inherit; color: inherit; }

:focus-visible {
  outline: var(--focus-width) solid var(--c-focus);
  outline-offset: var(--focus-offset);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

[hidden] { display: none !important; }

/* ---------- Значки: рисует скрипт, размер общий ---------- */

.pb-ico { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.pb-icon-btn {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex: none;
  padding: 0;
  border: 0;
  border-radius: var(--r-pill);
  background: transparent;
  color: var(--c-text-secondary);
  cursor: pointer;
  transition: background var(--dur-hover) var(--ease-standard), color var(--dur-hover) var(--ease-standard);
}
.pb-icon-btn:hover { background: var(--c-fill); color: var(--c-text); }

/* ---------- Левая панель ---------- */

.pb-rail {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  min-height: 0;
  padding: var(--sp-4) var(--sp-3);
  background: var(--pb-rail);
  border-right: 1px solid var(--pb-line);
}
.pb-rail__top { display: flex; align-items: center; justify-content: space-between; min-height: 36px; padding-inline: var(--sp-2); }
.pb-rail__close, .pb-rail__open { display: none; }
.pb-logo { font-size: var(--fs-body-lg); font-weight: var(--fw-semibold); letter-spacing: -0.01em; text-decoration: none; }

.pb-new {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  min-height: 40px;
  padding: 0 var(--sp-3);
  border: 1px solid var(--c-separator-strong);
  border-radius: var(--r-pill);
  background: var(--pb-bg);
  font-weight: var(--fw-medium);
  cursor: pointer;
}
.pb-new:hover { border-color: var(--c-text-tertiary); }
.pb-new__plus { font-size: 1.2em; line-height: 1; }

.pb-rail__label { margin: var(--sp-2) 0 0; padding-inline: var(--sp-2); color: var(--c-text-tertiary); font-size: var(--fs-caption); }

.pb-rail__scroll { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: var(--sp-1); overflow-y: auto; }
.pb-history { margin: 0; padding: 0; list-style: none; }
.pb-history__item { display: flex; align-items: center; border-radius: var(--r-sm); }
.pb-history__item:hover, .pb-history__item[data-active] { background: var(--c-fill); }
.pb-history__open {
  flex: 1;
  min-width: 0;
  padding: 7px var(--sp-2);
  overflow: hidden;
  border: 0;
  background: none;
  font-size: var(--fs-caption);
  line-height: var(--lh-caption);
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.pb-history__del { width: 28px; height: 28px; opacity: 0; }
.pb-history__del .pb-ico { width: 14px; height: 14px; }
.pb-history__item:hover .pb-history__del, .pb-history__del:focus-visible { opacity: 1; }
.pb-history__empty { padding-inline: var(--sp-2); color: var(--c-text-tertiary); font-size: var(--fs-caption); }

.pb-rail__bottom { display: flex; flex-direction: column; gap: var(--sp-1); padding: var(--sp-2) var(--sp-2) 0; border-top: 1px solid var(--pb-line); }
.pb-rail__link { color: var(--c-text-secondary); font-size: var(--fs-caption); }
.pb-rail__link:hover { color: var(--c-text); }

/* Личный кабинет: скрыт, пока сайт не сообщил, что он включён. */
.pb-account { display: flex; flex-direction: column; gap: var(--sp-2); margin-top: var(--sp-3); }
.pb-account .pb-btn { width: 100%; padding-block: 6px; text-align: center; }
.pb-account__text { margin: 0; color: var(--c-text-secondary); font-size: var(--fs-caption); line-height: var(--lh-caption); }
.pb-account__note { margin: 0; color: var(--c-booked); font-size: var(--fs-micro); line-height: var(--lh-micro); }
.pb-btn--danger { border-color: var(--c-sold); color: var(--c-sold); }
.pb-btn--danger:hover { background: var(--c-sold-soft); }

/* ---------- Главная колонка ---------- */

.pb-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; }

.pb-bar { display: flex; align-items: center; gap: var(--sp-2); min-height: 52px; padding: var(--sp-2) var(--sp-3); }
.pb-bar__title { flex: 1; min-width: 0; margin: 0; overflow: hidden; color: var(--c-text-secondary); font-size: var(--fs-caption); font-weight: var(--fw-regular); text-overflow: ellipsis; white-space: nowrap; }
.pb-bar__link { padding: 6px var(--sp-2); border-radius: var(--r-sm); color: var(--c-text-secondary); font-size: var(--fs-caption); text-decoration: none; white-space: nowrap; }
.pb-bar__link:hover { background: var(--c-fill); color: var(--c-text); }
.pb-city { flex: none; max-width: 46vw; min-height: 36px; padding: 0 var(--sp-2); border: 1px solid var(--pb-line); border-radius: var(--r-sm); background: var(--pb-bg); color: var(--c-text); font: inherit; font-size: var(--fs-caption); cursor: pointer; }

.pb-noscript { max-width: var(--pb-col); margin: var(--sp-4) auto; padding-inline: var(--sp-4); }

.pb-feed { position: relative; flex: 1; min-height: 0; overflow-y: auto; padding: var(--sp-2) var(--sp-4) var(--sp-5); scroll-behavior: smooth; outline: none; }
@media (prefers-reduced-motion: reduce) { .pb-feed { scroll-behavior: auto; } }

.pb-start { max-width: var(--pb-col); margin: clamp(16px, 9vh, 96px) auto 0; }
.pb-start__title { margin: 0 0 var(--sp-3); font-size: var(--fs-title-1); line-height: var(--lh-title-1); letter-spacing: var(--ls-title-1); font-weight: var(--fw-semibold); text-wrap: balance; }
.pb-start__lead { max-width: 60ch; margin: 0 0 var(--sp-5); color: var(--c-text-secondary); font-size: var(--fs-body-lg); line-height: var(--lh-body-lg); }

.pb-examples { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); margin: 0; padding: 0; list-style: none; }
.pb-example {
  width: 100%;
  height: 100%;
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--pb-line);
  border-radius: var(--r-md);
  background: none;
  text-align: left;
  cursor: pointer;
  transition: border-color var(--dur-hover) var(--ease-standard), background var(--dur-hover) var(--ease-standard);
}
.pb-example:hover { border-color: var(--c-separator-strong); background: var(--c-bg); }

.pb-start__alt { margin: var(--sp-4) 0 0; color: var(--c-text-secondary); font-size: var(--fs-caption); }

.pb-messages { display: flex; flex-direction: column; gap: var(--sp-5); max-width: var(--pb-col); margin-inline: auto; }

/* ---------- Сообщения ---------- */

.pb-msg-user { align-self: flex-end; max-width: 80%; }
.pb-msg-user__text { padding: 10px var(--sp-4); border-radius: var(--r-lg) var(--r-lg) var(--r-sm) var(--r-lg); background: var(--c-fill); white-space: pre-wrap; overflow-wrap: anywhere; }
.pb-msg-time { display: block; margin-top: var(--sp-1); color: var(--c-text-tertiary); font-size: var(--fs-micro); text-align: right; }

.pb-msg-bot { display: flex; flex-direction: column; gap: var(--sp-3); }
.pb-msg-bot p { max-width: 68ch; margin: 0; }
.pb-msg-bot .pb-msg-time { text-align: left; margin-top: 0; }

.pb-tags { display: flex; flex-wrap: wrap; gap: var(--sp-1) 6px; margin: 0; padding: 0; list-style: none; }
.pb-tag { padding: 2px 10px; border-radius: var(--r-pill); background: var(--c-fill); color: var(--c-text-secondary); font-size: var(--fs-caption); }

.pb-note { padding: 10px var(--sp-3); border-radius: var(--r-sm); background: var(--c-bg); color: var(--c-text-secondary); font-size: var(--fs-caption); line-height: var(--lh-caption); }
.pb-note--warn { background: var(--c-booked-soft); color: var(--c-booked); }
.pb-note--ok { background: var(--c-free-soft); color: var(--c-free); }

.pb-error { color: var(--c-sold); }

.pb-typing { display: flex; align-items: center; gap: 5px; height: 24px; }
.pb-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--c-text-tertiary); animation: pb-blink 1.1s infinite both; }
.pb-typing i:nth-child(2) { animation-delay: .15s; }
.pb-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes pb-blink { 0%, 70%, 100% { opacity: .25; } 35% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .pb-typing i { animation: none; } }

/* ---------- Карточка ЖК ---------- */

.pb-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--pb-line); border-radius: var(--r-lg); background: var(--pb-bg); }
.pb-card__head { padding: var(--sp-4) var(--sp-4) var(--sp-3); }
.pb-card__name { margin: 0; font-size: var(--fs-title-3); line-height: var(--lh-title-3); letter-spacing: var(--ls-title-3); font-weight: var(--fw-semibold); }
.pb-card__dev { margin: 2px 0 0; color: var(--c-text-secondary); font-size: var(--fs-caption); }

.pb-cover { position: relative; display: block; width: 100%; height: 190px; padding: 0; overflow: hidden; border: 0; background: var(--c-fill); color: var(--c-text-tertiary); cursor: pointer; }
.pb-cover > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
/* С фото обложка уже не кнопка: кнопка — сам кадр, иначе свайп не дойдёт до ленты. Плашки его не перехватывают. */
.pb-cover--photos { cursor: default; }
.pb-cover__chips { position: absolute; left: var(--sp-3); right: var(--sp-3); bottom: var(--sp-3); display: flex; flex-wrap: wrap; gap: 6px; pointer-events: none; }
.pb-media .gal__caption { padding: var(--sp-1) var(--sp-4) 0; }
.pb-cover__chip { padding: 3px 10px; border-radius: var(--r-pill); background: var(--pb-bg); color: var(--c-text); font-size: var(--fs-caption); box-shadow: var(--sh-1); }

.pb-card__facts { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4) 0; }
.pb-line { display: flex; align-items: flex-start; gap: var(--sp-2); margin: 0; color: var(--c-text-secondary); font-size: var(--fs-caption); line-height: var(--lh-caption); }
.pb-line--note { color: var(--c-text-tertiary); font-size: var(--fs-micro); }
.pb-line .pb-ico { width: 16px; height: 16px; margin-top: 1px; }
.pb-planned a { color: inherit; }

.pb-stations { display: flex; flex-direction: column; gap: 3px; margin: 0; padding: 0; list-style: none; }
.pb-station { display: flex; align-items: baseline; gap: var(--sp-2); font-size: var(--fs-caption); line-height: var(--lh-caption); }
.pb-station__mark { flex: none; width: 16px; color: var(--c-accent); font-weight: var(--fw-bold); text-align: center; }
.pb-station__time { color: var(--c-text-tertiary); white-space: nowrap; }

.pb-pricebar { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-1) var(--sp-3); margin: var(--sp-3) var(--sp-4) 0; padding: 10px var(--sp-4); border-radius: var(--r-md); background: var(--c-bg); font-variant-numeric: var(--numeric-tabular); }
.pb-pricebar__main { font-size: var(--fs-price-sm); font-weight: var(--fw-price); letter-spacing: var(--ls-price); line-height: var(--lh-price); }
.pb-pricebar__sep { color: var(--c-separator-strong); }
.pb-pricebar__m2 { color: var(--c-text-secondary); font-size: var(--fs-body); }

.pb-card__about { padding: var(--sp-3) var(--sp-4) 0; }
.pb-card__about summary { width: fit-content; font-size: var(--fs-body); font-weight: var(--fw-semibold); cursor: pointer; }
.pb-card__about p { margin-top: 2px; }
.pb-card__about p { margin: 0; color: var(--c-text-secondary); }

.pb-nearby { padding-top: var(--sp-1); border-top: 1px solid var(--pb-line); }
.pb-card__verdict { display: flex; flex-direction: column; gap: var(--sp-1); margin: var(--sp-3) var(--sp-4) 0; font-size: var(--fs-caption); line-height: var(--lh-caption); }
.pb-msg-bot p.pb-verdict { max-width: none; margin: 0; padding: 8px var(--sp-3); border-radius: var(--r-md); }
.pb-verdict--good { background: var(--c-accent-soft); color: var(--c-accent); }
.pb-verdict--warn { background: var(--c-booked-soft); color: var(--c-booked); }
.pb-card__adv { margin: var(--sp-3) var(--sp-4) 0; padding: 10px var(--sp-3); border-radius: var(--r-md); background: var(--c-free-soft); color: var(--c-free); font-size: var(--fs-caption); line-height: var(--lh-caption); }
.pb-card__adv h4 { margin: 0 0 var(--sp-1); font-weight: var(--fw-semibold); font-size: inherit; }
.pb-card__adv ol { margin: 0; padding-left: 1.3em; }

.pb-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); padding: var(--sp-4); }
.pb-card__rate { display: inline-flex; gap: var(--sp-1); margin-left: auto; }
.pb-rate[aria-pressed="true"] { background: var(--c-fill); color: var(--c-text); }
.pb-rate--up[aria-pressed="true"] { color: var(--c-sold); }
.pb-rate--up[aria-pressed="true"] .pb-ico { fill: currentColor; }
.pb-card--hidden { opacity: .55; }
.pb-msg-bot .pb-line--pay { margin: var(--sp-2) var(--sp-4) 0; }
.pb-line--pay { display: block; color: var(--c-text-secondary); }
.pb-line--pay b { color: var(--c-text); font-weight: var(--fw-semibold); font-variant-numeric: var(--numeric-tabular); }
.pb-links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.pb-links .pb-chip { display: inline-flex; align-items: center; gap: 6px; color: inherit; text-decoration: none; }
.pb-links .pb-ico { width: 16px; height: 16px; }
.pb-links__status { color: var(--c-text-secondary); font-size: var(--fs-caption); overflow-wrap: anywhere; }

.pb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  padding: 0 var(--sp-4);
  border: 1px solid var(--c-separator-strong);
  border-radius: var(--r-pill);
  background: transparent;
  color: var(--c-text);
  font-size: var(--fs-caption);
  font-weight: var(--fw-medium);
  text-decoration: none;
  cursor: pointer;
  transition: background var(--dur-hover) var(--ease-standard), border-color var(--dur-hover) var(--ease-standard);
}
.pb-btn:hover { background: var(--c-fill); }
.pb-btn .pb-ico { width: 16px; height: 16px; }
.pb-btn--ink { border-color: var(--pb-ink); background: var(--pb-ink); color: var(--pb-on-ink); }
.pb-btn--ink:hover { background: var(--pb-ink); opacity: .86; }
.pb-btn[aria-pressed="true"] { border-color: var(--c-free); background: var(--c-free-soft); color: var(--c-free); }
.pb-btn--down[aria-pressed="true"] { border-color: var(--c-sold); background: var(--c-sold-soft); color: var(--c-sold); }
.pb-btn--wide { flex: 1; }

/* ---------- Поле ввода ---------- */

.pb-composer { flex: none; display: flex; flex-direction: column; gap: var(--sp-2); width: 100%; max-width: calc(var(--pb-col) + var(--sp-4) * 2); margin-inline: auto; padding: var(--sp-2) var(--sp-4) var(--sp-3); }

.pb-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pb-chips:empty { display: none; }
.pb-chip { min-height: 32px; padding: 0 var(--sp-3); border: 1px solid var(--pb-line); border-radius: var(--r-pill); background: var(--pb-bg); font-size: var(--fs-caption); cursor: pointer; }
.pb-chip:hover { background: var(--c-fill); }
.pb-chip[aria-pressed="true"], .pb-chip--on { border-color: var(--pb-ink); background: var(--pb-ink); color: var(--pb-on-ink); }

.pb-input { display: flex; align-items: flex-end; gap: var(--sp-1); padding: 6px 6px 6px var(--sp-4); border: 1px solid var(--c-separator-strong); border-radius: var(--r-lg); background: var(--pb-bg); }
.pb-input:focus-within { border-color: var(--c-focus); box-shadow: 0 0 0 1px var(--c-focus); }
.pb-input textarea { flex: 1; min-width: 0; max-height: 140px; padding: 7px 0; border: 0; outline: none; resize: none; background: none; color: inherit; font: inherit; font-size: var(--fs-body-lg); line-height: 1.4; }
.pb-input textarea::placeholder { color: var(--c-text-tertiary); }

.pb-send { display: inline-grid; place-items: center; width: 36px; height: 36px; flex: none; padding: 0; border: 0; border-radius: 50%; background: var(--pb-ink); color: var(--pb-on-ink); cursor: pointer; }
.pb-send:disabled { background: var(--c-fill); color: var(--c-text-tertiary); cursor: default; }

.pb-voice { display: flex; align-items: center; gap: var(--sp-2); padding: 6px; border: 1px solid var(--c-separator-strong); border-radius: var(--r-lg); }
.pb-voice__wave { flex: 1; min-width: 0; width: 100%; height: 36px; color: var(--pb-ink); }

.pb-foot { margin: 0; color: var(--c-text-tertiary); font-size: var(--fs-micro); line-height: var(--lh-micro); text-align: center; text-wrap: balance; }

/* ---------- Правая панель ---------- */

.pb-scrim { position: fixed; inset: 0; z-index: 20; background: rgba(0, 0, 0, .38); }

.pb-panel { position: fixed; top: 0; right: 0; bottom: 0; z-index: 21; display: flex; flex-direction: column; width: var(--pb-panel-w); background: var(--pb-bg); box-shadow: var(--sh-3); }
.pb-panel__head { display: flex; align-items: center; gap: var(--sp-2); min-height: 60px; padding: var(--sp-2) var(--sp-3) var(--sp-2) var(--sp-5); border-bottom: 1px solid var(--pb-line); }
.pb-panel__title { flex: 1; min-width: 0; margin: 0; font-size: var(--fs-title-3); line-height: var(--lh-title-3); letter-spacing: var(--ls-title-3); font-weight: var(--fw-semibold); }
.pb-panel__body { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden auto; outline: none; }

.pb-tabs { position: sticky; top: 0; z-index: 2; display: flex; gap: var(--sp-5); padding-inline: var(--sp-5); border-bottom: 1px solid var(--pb-line); background: var(--pb-bg); }
.pb-tab { min-height: 44px; padding: 0; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--c-text-secondary); font-weight: var(--fw-medium); cursor: pointer; }
.pb-tab[aria-selected="true"] { border-bottom-color: var(--pb-ink); color: var(--c-text); }

.pb-sort { display: flex; flex-wrap: wrap; gap: 6px; padding: var(--sp-3) var(--sp-5) 0; }
.pb-count { margin: var(--sp-2) 0 0; padding-inline: var(--sp-5); color: var(--c-text-secondary); font-size: var(--fs-caption); }
.pb-count--note { margin-top: var(--sp-1); color: var(--c-text-tertiary); }
.pb-sort--rooms + .pb-sort { padding-top: var(--sp-2); }

.pb-flats { display: flex; flex-direction: column; gap: var(--sp-3); margin: 0; padding: var(--sp-3) var(--sp-5) var(--sp-5); list-style: none; }
.pb-flats--nested { grid-column: 1 / -1; padding: 0; }
.pb-flat__more { grid-column: 1 / -1; justify-self: start; }
.pb-flat__pay { color: var(--c-text-secondary); font-size: var(--fs-caption); white-space: nowrap; }

.pb-flat { display: grid; grid-template-columns: 148px minmax(0, 1fr) auto; gap: var(--sp-3) var(--sp-4); padding: var(--sp-3); border: 1px solid var(--pb-line); border-radius: var(--r-lg); }
.pb-plan { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: var(--sp-1); min-height: 132px; padding: var(--sp-2); overflow: hidden; border-radius: var(--r-md); background: var(--c-bg); color: var(--c-text-tertiary); font-size: var(--fs-micro); line-height: var(--lh-micro); text-align: center; text-decoration: none; }
a.pb-plan:hover { color: var(--c-text); }
.pb-plan img { display: block; max-width: 100%; max-height: 150px; object-fit: contain; background: #fff; }
.pb-plan .pb-ico { width: 28px; height: 28px; stroke-width: 1.3; }

.pb-flat__facts { min-width: 0; }
.pb-flat__title { margin: 0 0 var(--sp-1); font-size: var(--fs-body-lg); font-weight: var(--fw-semibold); }
.pb-flat__list { display: grid; gap: 2px; margin: 0; color: var(--c-text-secondary); font-size: var(--fs-caption); line-height: var(--lh-caption); }
.pb-flat__list div { display: flex; gap: 6px; }
.pb-flat__list dt { color: var(--c-text-tertiary); }
.pb-flat__list dd { margin: 0; }

.pb-flat__price { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; text-align: right; font-variant-numeric: var(--numeric-tabular); }
.pb-flat__old { color: var(--c-text-tertiary); font-size: var(--fs-caption); text-decoration: line-through; }
.pb-flat__now { font-size: var(--fs-price-sm); font-weight: var(--fw-price); letter-spacing: var(--ls-price); line-height: var(--lh-price); white-space: nowrap; }
.pb-discount { padding: 2px 8px; border-radius: var(--r-pill); background: var(--c-free-soft); color: var(--c-free); font-size: var(--fs-micro); white-space: nowrap; }
.pb-mark { padding: 2px 8px; border-radius: var(--r-pill); background: var(--c-booked-soft); color: var(--c-booked); font-size: var(--fs-micro); white-space: nowrap; }

.pb-flat__actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: var(--sp-2); }

.pb-more { margin: 0 var(--sp-5) var(--sp-5); }

/* ---------- Сравнение избранного ---------- */

.pb-rail__compare { align-self: flex-start; margin: var(--sp-1) var(--sp-2) var(--sp-2); }
.pb-compare { display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-4) var(--sp-5) var(--sp-5); }
.pb-compare__wrap { overflow-x: auto; }
.pb-compare table { width: 100%; border-collapse: collapse; font-size: var(--fs-caption); line-height: var(--lh-caption); font-variant-numeric: var(--numeric-tabular); }
.pb-compare th, .pb-compare td { min-width: 130px; padding: var(--sp-2); border-bottom: 1px solid var(--pb-line); font-weight: var(--fw-regular); text-align: left; vertical-align: top; }
.pb-compare tbody th { position: sticky; left: 0; min-width: 104px; background: var(--pb-bg); color: var(--c-text-secondary); }
.pb-compare thead th { font-size: var(--fs-body); font-weight: var(--fw-semibold); }
.pb-compare thead td { background: var(--pb-bg); }

/* ---------- Карта ---------- */

.pb-mapwrap { flex: 1; display: flex; flex-direction: column; min-height: 420px; }
.pb-map { flex: 1; width: 100%; min-height: 380px; border: 0; background: var(--c-fill); }
.pb-map__label { margin: var(--sp-3) var(--sp-5) 0; color: var(--c-text-tertiary); font-size: var(--fs-caption); }
.pb-map__cats { padding: var(--sp-2) var(--sp-5) var(--sp-3); }

/* ---------- Условия покупки ---------- */

.pb-terms { display: flex; flex-direction: column; gap: var(--sp-5); padding: var(--sp-4) var(--sp-5) var(--sp-6); }
.pb-terms section { display: flex; flex-direction: column; gap: var(--sp-2); }
.pb-terms h3 { margin: 0; font-size: var(--fs-body-lg); font-weight: var(--fw-semibold); }
.pb-terms p { margin: 0; }
.pb-terms__muted { color: var(--c-text-secondary); font-size: var(--fs-caption); line-height: var(--lh-caption); }

.pb-sum { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--sp-1) var(--sp-3); padding: var(--sp-3) var(--sp-4); border: 1px solid var(--pb-line); border-radius: var(--r-md); }
.pb-sum__name { font-weight: var(--fw-semibold); }
.pb-sum__price { font-size: var(--fs-price-sm); font-weight: var(--fw-price); letter-spacing: var(--ls-price); font-variant-numeric: var(--numeric-tabular); }

.pb-progs { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.pb-prog { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px var(--sp-3); padding: 10px var(--sp-3); border: 1px solid var(--pb-line); border-radius: var(--r-md); background: none; text-align: left; cursor: pointer; }
.pb-prog:hover { background: var(--c-bg); }
.pb-prog[aria-pressed="true"] { border-color: var(--pb-ink); box-shadow: inset 0 0 0 1px var(--pb-ink); }
.pb-prog__name { font-weight: var(--fw-medium); }
.pb-prog__pay { font-weight: var(--fw-semibold); font-variant-numeric: var(--numeric-tabular); white-space: nowrap; }
.pb-prog__why { grid-column: 1 / -1; color: var(--c-text-tertiary); font-size: var(--fs-caption); line-height: var(--lh-caption); }

.pb-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--sp-2); margin: 0; }
.pb-fact { padding: 10px var(--sp-3); border-radius: var(--r-md); background: var(--c-bg); }
.pb-fact dt { color: var(--c-text-tertiary); font-size: var(--fs-caption); }
.pb-fact dd { margin: 0; font-weight: var(--fw-semibold); font-variant-numeric: var(--numeric-tabular); }
.pb-fact--main { background: var(--pb-ink); color: var(--pb-on-ink); }
.pb-fact--main dt { color: inherit; opacity: .75; }

.pb-field { display: flex; flex-direction: column; gap: var(--sp-1); }
.pb-field__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--sp-1) var(--sp-3); }
.pb-field__head label { font-weight: var(--fw-medium); }
.pb-field__value { font-weight: var(--fw-semibold); font-variant-numeric: var(--numeric-tabular); }
.pb-field__range { display: flex; justify-content: space-between; color: var(--c-text-tertiary); font-size: var(--fs-micro); font-variant-numeric: var(--numeric-tabular); }
.pb-field input[type="range"] { width: 100%; margin: var(--sp-1) 0; accent-color: var(--pb-ink); }

.pb-tranches { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.pb-tranche { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--sp-1) var(--sp-3); align-items: baseline; padding: 10px var(--sp-3); border-radius: var(--r-md); background: var(--c-bg); font-variant-numeric: var(--numeric-tabular); }
.pb-tranche__n { font-weight: var(--fw-semibold); }
.pb-tranche__pay { font-weight: var(--fw-semibold); white-space: nowrap; }

/* ---------- Телефон ---------- */

@media (max-width: 860px) {
  body.pb { grid-template-columns: minmax(0, 1fr); }
  /* Закрытая панель не должна ловить фокус с клавиатуры и ронять тень на край экрана. */
  .pb-rail { position: fixed; inset: 0 auto 0 0; z-index: 30; width: min(300px, 86vw); visibility: hidden; transform: translateX(-102%); transition: transform var(--dur-expand) var(--ease-out), visibility var(--dur-expand); }
  .pb-rail[data-open] { visibility: visible; box-shadow: var(--sh-3); transform: none; }
  .pb-rail__close, .pb-rail__open { display: inline-grid; }
  .pb-examples { grid-template-columns: minmax(0, 1fr); }
  .pb-flat { grid-template-columns: 96px minmax(0, 1fr); }
  .pb-plan { min-height: 96px; }
  .pb-flat__price { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: baseline; justify-content: flex-start; gap: var(--sp-1) var(--sp-2); text-align: left; }
  .pb-panel__head { padding-left: var(--sp-4); }
  .pb-tabs, .pb-sort, .pb-count, .pb-flats, .pb-terms { padding-inline: var(--sp-4); }
  .pb-map__label, .pb-more { margin-inline: var(--sp-4); }
  .pb-map__cats { padding-inline: var(--sp-4); }
  .pb-msg-user { max-width: 92%; }
  /* Подсказки в одну строку: поле ввода не должно занимать четверть экрана. */
  .pb-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .pb-chip { flex: none; }
  .pb-cover { height: 150px; }
  .pb-bar__link { display: none; }
  /* Поле ввода не должно занимать четверть экрана: предупреждение видели, пока разговор не начался. */
  body[data-chatting] .pb-foot--privacy { display: none; }
  .pb-flat__actions .pb-btn { flex: 1 1 auto; }
}

/* Палец толще курсора: все цели касания не меньше 44 px. */
@media (pointer: coarse) {
  .pb-icon-btn, .pb-send { width: 44px; height: 44px; }
  .pb-btn, .pb-chip, .pb-new, .pb-city { min-height: 44px; }
  .pb-history__open { min-height: 44px; }
  .pb-history__del { width: 44px; height: 44px; opacity: 1; }
  .pb-rail__link, .pb-logo, .pb-foot a { display: inline-block; min-height: 24px; }
  .pb-rail__link { padding-block: 10px; }
  .pb-field input[type="range"] { height: 32px; }
}

@media (hover: none) {
  .pb-history__del { opacity: 1; }
}

@media (max-width: 340px) {
  .pb-flat { grid-template-columns: minmax(0, 1fr); }
}

@media print {
  body.pb { display: block; height: auto; overflow: visible; }
  .pb-rail, .pb-bar, .pb-composer, .pb-scrim, .pb-panel { display: none !important; }
  .pb-feed { overflow: visible; }
}

/* ---------- Условия покупки: дополнения ---------- */

.pb-about { display: flex; flex-direction: column; gap: var(--sp-2); }
.pb-conditions { margin: 0; padding-left: 1.2em; color: var(--c-text-secondary); font-size: var(--fs-caption); line-height: var(--lh-caption); }
.pb-sort--flush { padding: 0; }
.pb-field__label { font-weight: var(--fw-medium); }
